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中的History历史对象
Jan 16 Javascript
跨浏览器开发经验总结(四) 怎么写入剪贴板
May 13 Javascript
JQuery 弹出框定位实现方法
Dec 02 Javascript
Node.js中创建和管理外部进程详解
Aug 16 Javascript
jQuery实现只允许输入数字和小数点的方法
Mar 02 Javascript
JS 实现 ajax 异步浏览器兼容问题
Jan 21 Javascript
AngularJS基于provider实现全局变量的读取和赋值方法
Jun 28 Javascript
vue弹窗消息组件的使用方法
Sep 24 Javascript
JavaScript数据结构与算法之二叉树实现查找最小值、最大值、给定值算法示例
Mar 01 Javascript
js实现百度淘宝搜索功能
Feb 17 Javascript
在vs code 中如何创建一个自己的 Vue 模板代码
Nov 10 Javascript
JavaScript模拟实现网易云轮播效果
Apr 04 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
php实现的MySQL通用查询程序
2007/03/11 PHP
php daodb插入、更新与删除数据
2009/03/19 PHP
关于svn冲突的解决方法
2013/06/21 PHP
百度工程师讲PHP函数的实现原理及性能分析(一)
2015/05/13 PHP
PHP排序算法之堆排序(Heap Sort)实例详解
2018/04/21 PHP
运用jquery实现table单双行不同显示并能单行选中
2009/07/25 Javascript
点击显示指定元素隐藏其他同辈元素的方法
2014/02/19 Javascript
JavaScript数字和字符串转换示例
2014/03/26 Javascript
jQuery实现的仿百度分页足迹效果代码
2015/10/30 Javascript
javascript发送短信验证码实现代码
2015/11/12 Javascript
JavaScript 弹出子窗体并返回结果到父窗体的实现代码
2016/05/28 Javascript
JS创建对象的写法示例
2016/11/04 Javascript
利用Node.js编写跨平台的spawn语句详解
2017/02/12 Javascript
浅谈js-FCC算法Friendly Date Ranges(详解)
2017/04/10 Javascript
动态创建Angular组件实现popup弹窗功能
2017/09/15 Javascript
jQuery选择器之子元素过滤选择器
2017/09/28 jQuery
vue实例的选项总结
2020/06/09 Javascript
JavaScript实现烟花绽放动画效果
2020/08/04 Javascript
[56:00]DOTA2上海特级锦标赛主赛事日 - 4 胜者组决赛Secret VS Liquid第一局
2016/03/05 DOTA
Python实现Const详解
2015/01/27 Python
python numpy函数中的linspace创建等差数列详解
2017/10/13 Python
Python cookbook(字符串与文本)针对任意多的分隔符拆分字符串操作示例
2018/04/19 Python
使用 Python 处理 JSON 格式的数据
2019/07/22 Python
python 用 xlwings 库 生成图表的操作方法
2019/12/22 Python
浅谈selenium如何应对网页内容需要鼠标滚动加载的问题
2020/03/14 Python
使用jupyter notebook将文件保存为Markdown,HTML等文件格式
2020/04/14 Python
浅谈Keras中shuffle和validation_split的顺序
2020/06/19 Python
美国购买体育赛事门票网站:TicketCity
2019/03/06 全球购物
亚洲最大的运动鞋寄售店:KicksCrew
2020/11/26 全球购物
DELPHI中如何调用API,可举例说明
2014/01/16 面试题
《学棋》教后反思
2014/04/14 职场文书
2014年最新个人对照检查材料范文
2014/09/25 职场文书
机关单位工作失职检讨书
2014/11/20 职场文书
导游词之安徽巢湖
2019/12/26 职场文书
用Python简陋模拟n阶魔方
2021/04/17 Python
Fluentd搭建日志收集服务
2022/09/23 Servers