jquery事件与绑定事件
1.首先,我们来看一下经常使用的添加事件的方式:
<input type="button" id="btn" value="click me!" onclick="shao();" />
<script type="text/javascript">
function shao() {
alert("msg is showing!");
}
</script>
我们最常用的是为元素添加onclick元素属性的方式来添加事件
这种方法的弊端是：
只能为一个事件处理函数，在事件处理函数方法中，获取事件对象的方式不同.
jQuery中的事件
ready事件：
当页面加载完成后，来执行function：
<script>
$(document).ready(function(e){
alert(document.getElementById("aa").innerHTML);
//若是要写function方法，不可以在里面写
})
//要在外面写
</script>
这样写在哪里都可以调用到这个方法；
鼠标事件：
<script>
$("#aa").click(function(){
alert("点击事件");
})
$("#aa").dblclick(function(){
alert("双击事件");
})
$("#aa").mouseover(function(){
alert("鼠标移上")
});
$("#aa").mouseout(function(){
alert("鼠标离开");
})
$("#aa").mousemove(function(){
alert("鼠标移动");
}) $("#aa").mouseup(function(){
alert("鼠标抬起");
})
$("#aa").mousedown(function(){
alert("鼠标按下");
}) 键盘按键按下:给id加没有作用,需要给整个页面加所以用$(document)
$(document).KeyEvent(function(){
alert("鼠标离开");
}) </script>
表单元素事件：
<script>
$("#shao").focus(function(){
alert("获得焦点");
})
$("#shao").blur(function(){
alert("失去焦点");
})
$("#shao").change(function(){
alert("值发生变化，change事件");
})
$("#shao").keydown(function(){
alert("键盘按下");
})
</script>
2.绑定事件（挂事件）：
可以动态的改变按钮的事件；
什么是动态绑定？
动态绑定是指动态添加的DOM节点或者html元素，他们最开始时运行的时候是不存在的。如果要给这些动态加入的节点增加事件，就必须要用jquery的on方法来绑定事件。
bind()向匹配元素添加一个或多个事件处理器。
使用方式：
$(selector).bind(event,data,function)
注：bind()函数只能针对已经存在的元素进行事件的设置
代码：首先写两个按钮：
<body>
<div id="aa" style="width: 100px; height: 100px; background-color: blueviolet;">hello</div>
<!--<input type="text" id="shao" />-->
<input type="button" id="btn1" value="挂事件" />
<input type="button" id="btn2" value="移除事件" />
</body>
首先操作点击挂上事件：
<script>
//挂事件，
$("#btn1").click(function(){
//点击挂事件，给div绑定一个事件：
$("#aa").bind("click",function(){
//bind绑定事件
alert("点击");
});
//括号里两个参数，第一个是事件类型（事件名称），第二个参数是要执行的代码
})
</script>
这样的话点击挂事件：
移除事件的按钮：
<script>
//移除事件；
$("#aa").click(function(){
//点击移除事件；把div里面的事件移除掉
$("#aa").unbind("click");
//unbind移除绑定，填一个参数，要移除哪个事件
})
</script>
点击移除，取消aa得点击事件
3.事件数据
一般的事件包含事件源跟时间数据：
事件数据：出发这个时间，会传过来那些数据
js简化，可以不写事件源，因为可以取到
4.JSON语法：
JSON的结构：
json简单说就是javascript中的对象和数组，所以这两种结构就是对象和数组两种结构，通过这两种结构可以表示各种复杂的结构。
（1）对象：对象在js中表示为“{}”括起来的内容，数据结构为 {key：value,key：value,...}的键值对的结构，在面向对象的语言中，key为对象的属性，value为对应的属性值，所以很容易理解，取值方法为 对象.key 获取属性值，这个属性值的类型可以是 数字、字符串、数组、对象几种。
（2）数组：数组在js中是中括号“[]”括起来的内容，数据结构为 ["java","javascript","vb",...]，取值方式和所有语言中一样，使用索引获取，字段值的类型可以是 数字、字符串、数组、对象几种。
经过对象、数组2种结构就可以组合成复杂的数据结构了。
json是一种轻量级的数据交换格式
全拼：
JavaScript Object Notation
定义语法：
var j = {
"one":"111111",
"two":"22222"
};
取值方式：
取索引：
//数组的取值方式：
alert(j["one"]);//直接取索引的方法
点语法：
//点语法：
alert(j.one);
JSON也可以寸二维数组：
var j = {
"one":"111111",
"two":"22222",
"three":{"aa":"33333"},
};
//数组的取值方式：
//alert(j["one"]);//直接取索引的方法
//点语法：
alert(j.one);
alert(j.three.aa);
遍历JSON数据：
//遍历
for(var v in j)
{
//定义一个变量v，把j拿到v里面，关键字不是”as“了，是”in“，
alert(v);
// 这样便利的是索引
alert(j[v]);
// 这样是根据索引来取值
}
json不具有长度的属性，所以for循环不适应于json
但是for-in同样适应于数组
jquery事件与绑定事件的更多相关文章
- 关于Jquery的delegate绑定事件无效
今天在做一个页面,用的是easyui页面有很多的tabs,里面都放了iframe 需要在load事件动态调整iframe高度 发现始终无法使用delegate来绑定load事件. 纠结了一下午发现了问 ...
- jQuery学习-事件之绑定事件（三）
在上一篇<jQuery学习-事件之绑定事件(二)>我们了解了jQuery的dispatch方法,今天我们来学习下handlers 方法: handlers: function( event ...
- jQuery学习-事件之绑定事件（二）
在上一篇<jQuery学习-事件之绑定事件(一)>我们了解了jQuery的add方法,今天我们来学习下dispatch方法: dispatch: function( event ) { ...
- JQuery Mobile - 为什么绑定事件后会被多次执行？
JQuery Mobile 在绑定事件时候,发现会被多次执行,为什么啊? 原来,jquery click 不是替换原有的function ,而是接着添加,所以才会执行次数越来越多,怎么办才能按需实现 ...
- jquery-10 jquery中的绑定事件和解绑事件的方法是什么
jquery-10 jquery中的绑定事件和解绑事件的方法是什么 一.总结 一句话总结:bind(); unbind(); one(); 1. jquery中的绑定事件和解绑事件的方法是什么? bi ...
- 2017年3月25日工作日志：Jquery使用小结[绑定事件判断、select标签、军官证正则]
jQuery获取DOM绑定事件 在1.8.0版本之前,我们要想获取某个DOM绑定的事件处理程序可以这样: $.data(domObj,'events');//或者$('selector').data( ...
- jQuery添加html绑定事件
jQuery添加html绑定事件 $("#xxx").on("click",".dev",function(){ });
- jquery中on绑定事件
之前项目中动态创建的标签元素 在绑定事件的时候 都是无效 无论如何都不能触发 eg:在页面加载完成之后 再由脚本动态创建的<div>元素 在绑定事件的时候 例如click事件 ...
- jquery之on()绑定事件和off()解除绑定事件
off()函数用于移除元素上绑定的一个或多个事件的事件处理函数. off()函数主要用于解除由on()函数绑定的事件处理函数. 该函数属于jQuery对象(实例). 语法 jQuery 1.7 新增该 ...
- jQuery的live绑定事件在mobile safari（iphone / ipad / ipod）上失效的解决方案
jQuery的live绑定为什么会在mobile safari上失效呢?其实可以追溯到jQuery里live的实现方式.live的实现方式实际上是通过事件委托机制来实现的,也就是说是通过诸如冒泡的方式 ...
随机推荐
- 使用 StateServer 保存 Session 解决 Session过期，登陆过期问题。
使用 StateServer 保存 Session 正常操作情况下Session会无故丢失.因为程序是在不停的被操作,排除Session超时的可能.另外,Session超时时间被设定成60分钟,不会这 ...
- --@angularJS--$scope.watch监听模型变化
$watch简单使用 $watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你. $watch(watchExpression, listener, objectEqua ...
- C# 定时器计划任务
函数类: public class MyPlan { public void RunMyplan(object source, ElapsedEventArgs e) { //读取配置文件设定的日期时 ...
- node源码详解（三）—— js代码在node中的位置，process、require、module、exports的由来
本作品采用知识共享署名 4.0 国际许可协议进行许可.转载保留声明头部与原文链接https://luzeshu.com/blog/nodesource3 本博客同步在https://cnodejs.o ...
- mesos 资源分配
Mesos 资源分配 众所周知, Mesos在运行时使用wDRF( Dominant Resource Fairness)算法进行一级资源分配, 通过应用程序(Framework)运行时使用资源进行二 ...
- POJ1556(割点)
SPF Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 8114 Accepted: 3716 Description C ...
- Docker 1.13 管理命令
1.12 CLI 的问题 Docker1.12 命令行接口(CLI)有40多个顶级命令,这些命令存在以下问题: 没有归类组织,这让docker 新手很难学习: 有些命令没有提供足够的上下文环境,以至于 ...
- shell编程其实真的很简单（三）
通过前两篇文章,我们掌握了shell的一些基本写法和变量的使用,以及基本数据类型的运算.那么,本次就将要学习shell的结构化命令了,也就是我们其它编程语言中的条件选择语句及循环语句. 不过,在学习s ...
- 初识Jenkins
近期,接手了一个活,我要搭一个Jenkins持续集成的平台,所以,就把这次工作的收获分享给大家了. Jenkins是什么 Jenkins插件配置 Jenkins怎么用 新建job 系统配置 添加用户 ...
- assign和weak的深层次解析
我们知道在设置类的属性时,控件一般中weak,对象一般用strong,数据类型一般使用assign,其中weak和assign都不会使计数器增加,那为什对象不可以使用assign呢? weak与ass ...