您现在的位置是:首页 > Javascript
当前栏目
JQuery绑定事件与移除事件、动画
2023-04-18 14:47:13 时间
绑定事件:bind()、on()、live()、delegate()、keyup(); 触发事件:trigger(‘keyup’)、keyup(); 解绑事件:unbind()、off()、die()、undelegate(); 符合事件:hover() 、toggle(); 事件绑定:bind();
一、绑定事件
JQuery绑定事件,除 bing()
方法之外,还有 on()
、live()
、one()
等
事件的绑定方法。
绑定事件分类:
(a) 绑定单个事件
$("#btn").bind("click",function(){
//代码块
console.log(123);
});
(b) 同时绑定多个事件
$("#btn").bind({
mouseover:function(){
$(this).css("background","red");
console.log("代码块1");
},
mouseout:function(){
console.log("代码块2");
},
click:function(){
console.log("点击事件");
}
});
JQuery中的 bind()、live()、delegate()事件方法的区别,请查阅: http://www.php100.com/html/program/jquery/2013/0905/5993.html
二、移除事件
(a)使用 unbind() 方法 移除事件
$("button").click(function(){
$("p").unbind();
});
三、JQuery动画
在Jquery 中,提供了一系列显示动画效果的方法,其中,
show()
——— 方法控制元素的显示;hide()
———-方法控制元素的显示;toggle()
——-方法切换元素的可见状态;fadeIn()
——-方法淡入;fadeOut()
——方法淡出;slideUp()
——方法实现元素的收缩slideDown()
—方法实现元素的展开
相关文章
- 【HTML+CSS】实现网页的导航栏和下拉菜单
- Vue3报错:Property “xxx“ was accessed during render but is not defined on instance.
- 前端如何调用后端接口进行数据交互(极简)
- Css 弹性布局(Flex)详细介绍(Flex 属性详解、场景分析)
- 前端工程化详解——理解与实践前端工程化
- vue3-setup语法糖之组件传参(defineProps、defineEmits、defineExpose)
- vue项目网页自适应,等比例放大缩小
- Vue使用axios发送get请求并携带参数
- 【微信小程序】使用uni-app——开发首页搜索框导航栏(可同时兼容APP、H5、小程序)
- 【Vue】Axios详解
- 安装nvm,并使用nvm安装nodejs及配置环境变量
- 开发日志01-后端以文件流的形式供前端下载
- “export ‘default‘ (imported as ‘VueRouter‘) was not found in ‘vue-router‘报错分析
- 四、vue中路由router配置详解
- DevTools 无法加载来源映射:无法加载 chrome-extension: 警告的原因以及如何去除(全网最全 最详细解决方案)
- 「兔了个兔」玉兔踏青,纯CSS实现瑞兔日历(附源码)
- React组件的生命周期函数
- 在Vue中使用高德地图
- vue3 + vite 性能优化 ( 从5s -> 0.5s )
- 【React】React——redux