jquery动态绑定事件的方法_Jquery绑定事件及动画效果
绑定事件
bind(type, data, fuc)
one(type, data, fuc) //只执行一次
常见事件类型
名称含义blur失去焦点focus获得焦点load加载resize重置大小scroll滚动unload卸载click点击dblclick双击mousedown鼠标按下mouseup鼠标弹起mousemove鼠标移动mouseover鼠标悬停mouseout鼠标移走mouseenter鼠标移入mouseleave鼠标离开change内容改变select选中submit提交keydown有键按下keypress有键按下keyup有键弹起error有错误
判断是否显示
if($("#id").is(":visible")){ }else{ }
简化绑定事件
$(this).mouseover(function(){ //代码 })
Hover事件
hover(enter,leave)
光标移入,触发第一个事件,光标移走,触发第二个事件
$("#id").hover(function(){ //光标移入 },function(){ //光标移出 })
toggle事件
$("#id").toggle(function(){ //第一次点击 },function(){ //第二次点击 })
$(this).toggle(); //表示显示隐藏之间的切换 $(this).slideToggle(); //切换显示 $(this).fadeTo(1000,0.5); //1000ms淡化到0.5透明度
阻止事件的冒泡event.stopPropagation()
阻止默认事件的发生event.preventDefault()
补充:可以通过return false;阻止默认事件。
获取事件针对的对象event.target
获取光标所在页面的位置event.pageX() / event.pageY()
获取鼠标按键类型event.which() 1左键2中键3右键
移除所有的绑定事件
$("#id").unbind("click") 或 $("#id").unbind();
移除指定的事件
$("#id").unbind("click",funName);
模拟触发事件
$("#id").trigger("click"); 或 $("#id").click();
元素的显示隐藏
$("#id").show();
$("#id").hide();
$("#id").show("slow"); //600ms $("#id").show("normal"); //400ms $("#id").show("fast"); //200ms $("#id").hide("slow"); //600ms $("#id").hide("normal"); //400ms $("#id").hide("fast");//200ms $("#id").show(1000);//1000ms
元素的淡入淡出
$("#id").fadeIn(); $("#id").fadeOut();
元素延展出现或隐藏
$("#id").slideDown(); //显示 $("#id").slideUp(); //隐藏
自定义动画
animate(param,speed, callback);
$(this).animate({"left":"500px"},3000); //三秒内,位置改变到指定地方 $(this).animate({"left":"+=500px"},3000); //三秒内,位置改变500px $(this).animate({"left":"-=500px"},3000); //三秒内,位置改变500px
jquery动态绑定事件的方法_Jquery绑定事件及动画效果相关推荐
- jQuery给动态添加的元素绑定事件的方法
jquery中绑定事件一般使用bind,或者click,但是这只能是对已经加载好的元素定义事件,那些后来添加插入的元素则需要另行绑定.在1.7版本以前使用live.但是在1.8版本以后推荐使用on.这 ...
- ajax传向前台的html代码里又有事件的时候,绑定事件失败解决方法
为动态添加的元素绑定事件有以下几种方式: 1.delegate():向匹配元素的当前或未来的子元素附加一个或多个事件处理器 $(selector).delegate(childSelector,eve ...
- jQuery 为动态添加的元素绑定事件
在使用jquery的方式为元素绑定事件时,我经常使用bind或者click,但这只能为页面已经加载好的元素绑定事件.像需要用ajax的方式请求远程数据来动态添加页面元素时,显然以上几种绑定事件的方式是 ...
- html 未来元素绑定事件,jquery on如何给未来元素绑定事件?
我们要想在一个元素上绑定一个事件,那么这个元素必须先存在,也就是绑定事件动作前就已有这个元素. 这是一个给元素绑定任何事件的前提. 如果按照这种思路走,那么"给未来元素绑定事件"将 ...
- jquery每次动态加载dom,绑定事件会多一次,
jquery绑定事件,每次动态加载dom,绑定的事件会加1,比如动态加载dom5次,点那个点击事件会弹出5次 解决办法就是在每次绑定之前解绑定. $('.seek-footer .btn1').off ...
- jQuery动态生成的元素如何绑定事件
这段时间在写代码的时候遇到一个问题,通过append()添加的节点,点击事件不起作用.当时我百思不得其解,各种找错都没找到错误的原因.后来才发现是动态生成节点的问题,还是自己没有经验啊. 下面来 ...
- jquery绑定点击事件形参_JQuery 绑定事件时传递参数的实现方法
如题,比如我想在$(":text").bind("keyup",funcionName);将当前的文本框作为参数传递给 functionName所代表的函数,应 ...
- html的后绑定事件,HTML 控件绑定事件
文章摘自 http://www.jb51.net/article/26552.htm 1. 第一种添加事件的方式,直接在html的属性中写JS代码 Div1 Element Div1 Element ...
- webp转换gif动图的方法-批量转换并保留动画效果
前言 上次我们讲了如何批量把webp转jpg.png.bmp等静态图片格式.这次我们来讲讲如何将动态webp转换成其他的动态图片格式,比如gif动画格式.也许有同学要问了,问什么两个格式不一样呢?这是 ...
最新文章
- Linux之redhat7系统结构
- 攀枝花市大数据中心落户东区
- c程序设计语言第五单元,(C语言程序设计基础课件)第五单元循环结构程序设计.pptx...
- 使用lucene进行group操作
- ob_start()失效与phpunit的非正常结束
- 自动登录126邮箱的脚本
- 调查显示开发者最讨厌 PHP,最爱 Python
- SAP中外向交货单出具发票无法生成会计凭证
- Istio 1.1.1 发布,修复漏洞并改进鲁棒性
- 不降的数字(51Nod-2499)
- ionic3使用第三方图标
- 关于秩的等式与不等式总结
- mysql时间类型英文_英文日期格式及缩写
- Fastdb安装与使用
- K-means(tri)利用三角不等式性质加速k-means
- 什么时候应该在ECMAScript 6中使用Arrow函数?
- 直播已入下半场,秀场直播该何去何从?
- 中国联通将 900MHz 频段频谱资源重耕用于 5G 系统,更有利用把5G网络覆盖到边远地区的每一寸土地
- 在IOS设备上调试(真机调试)
- Firefox插件开发-入门篇
热门文章
- Java ArrayList与LinkedList数据结构和特点
- eclipse debug(程序调试)单步执行 简述
- c 插件读取有属性的html6,廖雪峰的JS教程6-jQuery
- java写一个99到0_Java中一个普通的循环为何从10开始到99连续相乘会得到0?
- lintcode最长回文子串(Manacher算法)
- php windows共享内存,给PHP开启shmop扩展实现共享内存
- vant部署_vant ui rem配置流程
- android签名忘记密码,修改Android签名证书keystore的密码、别名alias以及别名密码
- php创建表设置编码,教您在Zend Framework里如何设置数据库编码以及怎样给数据表设定前缀!...
- c语言字符串文库总结,C语言程序设计入门:字符串函数