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 相关文章推荐
用js实现的页面关键字密度查询代码
Dec 27 Javascript
Prototype 学习 工具函数学习($A方法)
Jul 12 Javascript
基于jquery库的tab新形式使用
Nov 16 Javascript
js关闭子窗体刷新父窗体实现方法
Dec 04 Javascript
JQuery中extend使用介绍
Mar 13 Javascript
javascript中传统事件与现代事件
Jun 23 Javascript
javascript去掉代码里面的注释
Jul 24 Javascript
js调用父框架函数与弹窗调用父页面函数的简单方法
Nov 01 Javascript
浅谈$_FILES数组为空的原因
Feb 16 Javascript
解决Vue页面固定滚动位置的处理办法
Jul 13 Javascript
对layui数据表格动态cols(字段)动态变化详解
Oct 25 Javascript
Vue 实现CLI 3.0 + momentjs + lodash打包时优化
Nov 13 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调用方法mssql_fetch_row、mssql_fetch_array、mssql_fetch_assoc和mssql_fetch_objcect读取数据的区别
2012/08/08 PHP
php对包含html标签的字符串进行截取的函数分享
2014/06/19 PHP
PHP获取当前完整URL地址的函数
2014/12/21 PHP
php断点续传之文件分割合并详解
2016/12/13 PHP
PHP使用preg_split()分割特殊字符(元字符等)的方法分析
2017/02/04 PHP
php和vue配合使用技巧和方法
2019/05/09 PHP
PHP抽象类与接口的区别实例详解
2019/05/09 PHP
JS 控制非法字符的输入代码
2009/12/04 Javascript
javascript图像处理—仿射变换深度理解
2013/01/16 Javascript
javascript简单实现命名空间效果
2014/03/06 Javascript
Nodejs进程管理模块forever详解
2014/06/01 NodeJs
JS实现图片放大镜效果的方法
2015/02/27 Javascript
讲解JavaScript中for...in语句的使用方法
2015/06/03 Javascript
JavaScript判断DIV内容是否为空的方法
2016/01/29 Javascript
基于jquery实现智能提示控件intellSeach.js
2016/03/17 Javascript
理解javascript模块化
2016/03/28 Javascript
js内置对象处理_打印学生成绩单的简单实现
2016/09/24 Javascript
JQueryEasyUI框架下的combobox的取值和绑定的方法
2017/01/22 Javascript
weui框架实现上传、预览和删除图片功能代码
2017/08/24 Javascript
vue页面加载闪烁问题的解决方法
2018/03/28 Javascript
详解vue 计算属性与方法跟侦听器区别(面试考点)
2018/04/23 Javascript
JavaScript实现京东放大镜效果
2019/12/03 Javascript
node.js中stream流中可读流和可写流的实现与使用方法实例分析
2020/02/13 Javascript
react国际化化插件react-i18n-auto使用详解
2020/03/31 Javascript
[01:00:30]TFT vs VGJ.T Supermajor 败者组 BO3 第一场 6.5
2018/06/06 DOTA
Python功能点实现:函数级/代码块级计时器
2019/01/02 Python
解决paramiko执行命令超时的问题
2020/04/16 Python
Selenium及python实现滚动操作多种方法
2020/07/21 Python
Dr. Martens马汀博士官网:马丁靴始祖品牌
2016/10/15 全球购物
信息技术专业大学生职业生涯规划书
2014/01/24 职场文书
小学教师师德师风承诺书
2015/04/28 职场文书
2015年世界急救日宣传活动方案
2015/05/06 职场文书
同学会感言
2015/07/30 职场文书
python制作图形界面的2048游戏, 基于tkinter
2021/04/06 Python
Python List remove()实例用法详解
2021/08/02 Python
python3 字符串str和bytes相互转换
2022/03/23 Python