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 相关文章推荐
弹出窗口并且此窗口带有半透明的遮罩层效果
Mar 13 Javascript
javascript对中文按照拼音排序代码
Aug 20 Javascript
使用js dom和jquery分别实现简单增删改
Sep 11 Javascript
基于JavaScript获取鼠标位置的各种方法
Dec 16 Javascript
BootStrap 表单控件之单选按钮水平排列
May 23 Javascript
JS正则表达式完美实现身份证校验功能
Oct 18 Javascript
Vue 源码分析之 Observer实现过程
Mar 29 Javascript
react-router4按需加载(踩坑填坑)
Jan 06 Javascript
通过seajs实现JavaScript的模块开发及按模块加载
Jun 06 Javascript
vue 使用 vue-pdf 实现pdf在线预览的示例代码
Apr 26 Javascript
vue使用keep-alive实现组件切换时保存原组件数据方法
Oct 30 Javascript
JavaScript中条件语句的优化技巧总结
Dec 04 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处理图片变得简单 基于gb库的图片处理类附实例代码下载
2011/05/17 PHP
php网站被挂木马后的修复方法总结
2014/11/06 PHP
PHP使用PDO调用mssql存储过程的方法示例
2017/10/07 PHP
postman的安装与使用方法(模拟Get和Post请求)
2018/08/06 PHP
thinkphp框架使用JWTtoken的方法详解
2019/10/10 PHP
jQuery+PHP实现图片上传并提交功能
2020/07/27 PHP
JavaScript Event学习第三章 早期的事件处理程序
2010/02/07 Javascript
JS实现一个列表中包含上移下移删除等功能
2014/09/24 Javascript
AngularJS Bootstrap详细介绍及实例代码
2016/07/28 Javascript
chrome下判断点击input上标签还是其余标签的实现方法
2016/09/18 Javascript
基于vue-cli创建的项目的目录结构及说明介绍
2017/11/23 Javascript
js实现鼠标单击Tab表单切换效果
2018/05/16 Javascript
vue打包相关细节整理(小结)
2018/09/28 Javascript
在layui.use 中自定义 function 的正确方法
2019/09/16 Javascript
OpenLayers3实现鼠标移动显示坐标
2020/09/25 Javascript
Vue实现返回顶部按钮实例代码
2020/10/21 Javascript
用Python创建声明性迷你语言的教程
2015/04/13 Python
使用rpclib进行Python网络编程时的注释问题
2015/05/06 Python
python-itchat 获取微信群用户信息的实例
2019/02/21 Python
Python 迭代,for...in遍历,迭代原理与应用示例
2019/10/12 Python
使用python的turtle绘画滑稽脸实例
2019/11/21 Python
Django serializer优化类视图的实现示例
2020/07/16 Python
CSS3制作Dropdown下拉菜单的方法
2015/07/18 HTML / CSS
英国广泛的照明产品网站:Lights4living
2018/01/28 全球购物
人力资源管理系自荐信
2014/05/31 职场文书
医院反腐倡廉演讲稿
2014/09/16 职场文书
民主评议政风行风活动心得体会
2014/10/29 职场文书
小学生通知书评语
2014/12/31 职场文书
求职简历自荐信怎么写
2015/03/26 职场文书
大学生安全教育主题班会
2015/08/12 职场文书
学风建设主题班会
2015/08/17 职场文书
幽默口才训练经典句子(48句)
2019/08/19 职场文书
智慧人生:永远不需要向任何人解释你自己
2019/08/20 职场文书
个人销售励志奋斗口号
2019/12/05 职场文书
Python中快速掌握Data Frame的常用操作
2021/03/31 Python
MySQL Router的安装部署
2021/04/24 MySQL