jQuery绑定事件的几种实现方式


Posted in Javascript onMay 09, 2016

本文实例为大家分享了jQuery绑定事件多种实现方法,供大家参考,具体内容如下

<html>
<head>
<meta charset="utf-8" />
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script><!--百度CDN-->
</head>

<body>
<input type="text"/>
<input type="button" value="button1"/>
<script>
$(function(){
  var text = $(":text");
  var button = $(":button");
  //调试器记录日志 console.log("message"); 如:火狐浏览器,打开FireBug(按F12)
  
  //触发单个事件:两种方式
  button.bind("mouseover",function(){
    console.log("移入");
  });
  button.bind({
    "mouseout": function(){
      console.log("移出");
    }
  });
  //多个事件:三个方式
  text.bind("dblclick blur",function(){
    console.log("双击或者失去焦点");
  });
  text.bind({
    "dblclick blur":function(){
      console.log("双击或者失去焦点");
    }
  });
  text.bind({
    "dblclick":function(){
      console.log("双击");
    },
    blur:function(){
      console.log("失去焦点");
    }
  });
  
  //取消事件
  text.unbind("dblclick"); //取消单个事件
  //text.unbind("dblclick blur"); //取消多个事件
  //text.unbind(); //取消全部事件
});

</script>
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家继续关注小编为大家分享的精彩文章。

Javascript 相关文章推荐
jquery获取input的value问题说明
Aug 19 Javascript
微博@符号的用户名提示效果。(想@到谁?)
Nov 05 Javascript
关于js中for in的缺陷浅析
Dec 02 Javascript
Array 重排序方法和操作方法的简单实例
Jan 24 Javascript
js+CSS实现模拟华丽的select控件下拉菜单效果
Sep 01 Javascript
jQuery simpleModal插件的使用介绍
Aug 30 Javascript
JS无缝滚动效果实现方法分析
Dec 21 Javascript
详解ECMAScript6入门--Class对象
Apr 27 Javascript
微信小程序中使用ECharts 异步加载数据实现图表功能
Jul 13 Javascript
浅谈redux以及react-redux简单实现
Aug 28 Javascript
vue 实现搜索的结果页面支持全选与取消全选功能
May 10 Javascript
微信小程序实现单个卡片左滑显示按钮并防止上下滑动干扰功能
Dec 06 Javascript
jquery实现左右无缝轮播图
Jul 31 #Javascript
node.js从数据库获取数据
May 08 #Javascript
JavaScript希尔排序、快速排序、归并排序算法
May 08 #Javascript
基于jquery实现最简单的选项卡切换效果
May 08 #Javascript
基于javascript实现图片滑动效果
May 07 #Javascript
基于jquery实现图片放大功能
May 07 #Javascript
基于bootstrap插件实现autocomplete自动完成表单
May 07 #Javascript
You might like
php接口与接口引用的深入解析
2013/08/09 PHP
php $_SERVER windows系统与linux系统下的区别说明
2014/02/14 PHP
php + WebUploader实现图片批量上传功能
2019/05/06 PHP
javascript 动态table添加colspan\rowspan 参数的方法
2009/07/25 Javascript
JavaScript使用IEEE 标准进行二进制浮点运算产生莫名错误的解决方法
2011/05/28 Javascript
javascript object array方法使用详解
2012/12/03 Javascript
JS点击链接后慢慢展开隐藏着图片的方法
2015/02/17 Javascript
javascript制作的滑动图片菜单
2015/05/15 Javascript
javascript实现网页屏蔽Backspace事件,输入框不屏蔽
2015/07/21 Javascript
JQuery入门基础小实例(1)
2015/09/17 Javascript
浅谈jQuery 中的事件冒泡和阻止默认行为
2016/05/28 Javascript
jQuery实现邮箱下拉列表自动补全功能
2016/09/08 Javascript
Bootstrap模态框禁用空白处点击关闭
2016/10/20 Javascript
HTML5 JS压缩图片并获取图片BASE64编码上传
2020/11/16 Javascript
浅谈jquery采用attr修改form表单enctype不起作用的问题
2016/11/25 Javascript
使用cropper.js裁剪头像的实例代码
2017/09/29 Javascript
vue动态设置img的src路径实例
2018/09/18 Javascript
微信小程序实现图片选择并预览功能
2019/07/25 Javascript
layui数据表格重载实现往后台传参
2019/11/15 Javascript
微信小程序文章列表功能完整实例
2020/06/03 Javascript
详解python使用递归、尾递归、循环三种方式实现斐波那契数列
2018/01/16 Python
详解Python中的分组函数groupby和itertools)
2018/07/11 Python
对Python实现简单的API接口实例讲解
2018/12/10 Python
Python3实现的反转单链表算法示例
2019/03/08 Python
python实现opencv+scoket网络实时图传
2020/03/20 Python
基于Python编写一个计算器程序,实现简单的加减乘除和取余二元运算
2020/08/05 Python
python实现马丁策略回测3000只股票的实例代码
2021/01/22 Python
Python爬取你好李焕英豆瓣短评生成词云的示例代码
2021/02/24 Python
会计出纳岗位职责
2013/12/25 职场文书
三好学生演讲稿范文
2014/04/26 职场文书
服务型党组织建设典型材料
2014/05/07 职场文书
合唱兴趣小组活动总结
2014/07/10 职场文书
市场总监岗位职责
2015/02/11 职场文书
PHP对接阿里云虚拟号的实现(号码隐私保护)
2021/04/06 PHP
PyQt5实现多张图片显示并滚动
2021/06/11 Python
SQL Server作业失败:无法确定所有者是否有服务器访问权限的解决方法
2021/06/30 SQL Server