Jquery注册事件实现方法


Posted in Javascript onMay 18, 2015

本文实例讲述了Jquery注册事件实现方法。分享给大家供大家参考。具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>事件绑定</title>
<script src="jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
var oldColor;
$(function () {
  //注册ID为btnTest的按钮的click事件
  $("#btnTest").click(function () {
    var $divs = $("div");
    $divs.html("我是修改后的Div文本");
  });
  //注册ID为btnTest的按钮的mouseover事件,鼠标经过时添加背景色
  $("#btnTest").mouseover(function () {
    oldColor = $("#btnTest").css("background-color");
    $("#btnTest").css("background-color", "green");
  });
  //注册ID为btnTest的按钮的mouseout事件,鼠标离开时还原背景色
  $("#btnTest").mouseout(function () {
    $("#btnTest").css("background-color", oldColor);
  });
});
</script>
</head>
<body>
<div id="main">
 <div id="div1" class="myDiv">我是div1
  <div id="divSun">我是孙子div
    <div id="divSunSun">我是孙子的孙子div</div>
  </div>
  <div id="divSun1">我是孙子div</div>
 </div>
<div id="div2" class="myDiv">我是div2</div>
</div>
<div id="main1"></div>
<div id="main2"></div>
<input id="btnTest" type="button" value="测试按钮" />
<div id="main3"></div>  
</body>
</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript 利用Cookie记录用户登录信息
Dec 08 Javascript
javascript 程序库的比较(一)之DOM功能
Apr 07 Javascript
Extjs TimeField 显示正常时间格式的代码
Jun 28 Javascript
Java/JS获取flash高宽的具体方法
Dec 27 Javascript
js实现按一下删除键删除整个单词附demo
Sep 05 Javascript
jQuery检测鼠标左键和右键点击的方法
Mar 17 Javascript
bootstrap-treeview自定义双击事件实现方法
Jan 09 Javascript
layui文件上传实现代码
May 20 Javascript
vue 本地环境跨域请求proxyTable的方法
Sep 19 Javascript
node命令行工具之实现项目工程自动初始化的标准流程
Aug 12 Javascript
jQuery实现简单飞机大战
Jul 05 jQuery
谈谈JavaScript中的垃圾回收机制
Sep 17 Javascript
jquery中map函数遍历数组用法实例
May 18 #Javascript
jquery使用each方法遍历json格式数据实例
May 18 #Javascript
Jquery使用css方法改变样式实例
May 18 #Javascript
Jquery使用val方法读写value值
May 18 #Javascript
JQuery中Text方法用法实例分析
May 18 #Javascript
JQuery中attr方法和removeAttr方法用法实例
May 18 #Javascript
JQuery中节点遍历方法实例
May 18 #Javascript
You might like
BBS(php &amp; mysql)完整版(一)
2006/10/09 PHP
PHP 编程安全性小结
2010/01/08 PHP
phpinfo()中Loaded Configuration File(none)的解决方法
2017/01/16 PHP
Laravel Intervention/image图片处理扩展包的安装、使用与可能遇到的坑详解
2017/11/14 PHP
javascript parseInt 函数分析(转)
2009/03/21 Javascript
jquery 弹出登录窗口实现代码
2009/12/24 Javascript
Exjs 入门篇
2010/04/07 Javascript
jquery中的查找parents与closest方法之间的区别
2013/12/02 Javascript
基于JavaScript实现动态创建表格和增加表格行数
2015/12/20 Javascript
javascript从作用域链谈闭包
2020/07/29 Javascript
jquery 全选、全不选、反选效果的实现代码【推荐】
2016/05/05 Javascript
node.js学习之base64编码解码
2016/10/21 Javascript
jQuery基于ajax方式实现用户名存在性检查功能示例
2017/02/10 Javascript
javascript 中Cookie读、写与删除操作
2017/03/29 Javascript
利用Vue实现移动端图片轮播组件的方法实例
2017/08/23 Javascript
layui table表格数据的新增,修改,删除,查询,双击获取行数据方式
2019/11/14 Javascript
如何基于filter实现网站整体变灰功能
2020/04/17 Javascript
Bootstrap FileInput实现图片上传功能
2021/01/28 Javascript
[46:40]VGJ.T vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
使用python检测手机QQ在线状态的脚本代码
2013/02/10 Python
python中实现定制类的特殊方法总结
2014/09/28 Python
Python获取文件所在目录和文件名的方法
2017/01/12 Python
Python中%是什么意思?python中百分号如何使用?
2018/03/20 Python
python绘制立方体的方法
2018/07/02 Python
Windows下安装Scrapy
2018/10/17 Python
Python求均值,方差,标准差的实例
2019/06/29 Python
python爬虫scrapy基于CrawlSpider类的全站数据爬取示例解析
2021/02/20 Python
澳大利亚冲浪和时尚服装网上购物:SurfStitch
2017/07/29 全球购物
String s = new String(“xyz”);创建了几个String Object?
2015/08/05 面试题
Java基础类库面试题
2013/09/04 面试题
优秀实习生主要事迹
2014/05/29 职场文书
群众路线领导班子四风对照检查材料
2014/09/27 职场文书
西湖英语导游词
2015/02/06 职场文书
2015年创先争优活动总结
2015/03/27 职场文书
2015年小学总务工作总结
2015/07/21 职场文书
vue中利用mqtt服务端实现即时通讯的步骤记录
2021/07/01 Vue.js