<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title></title>
<style>
.test2 {
background: #bbffaa;
}
.test3 {
background: yellow;
}
.test2,.test3{
border: 1px solid red;
}
</style>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
<h2>.click()方法</h2>
<h4>测试一</h4>
<button>元素绑定事件,弹出回调中的this</button>
<script type="text/javascript">
//this指向button元素
$("button:eq(0)").click(function() {
alert(this)
})
</script>
<h4>测试二</h4>
<div class="test2">
<p>$('button:first').click(function(e) {alert(this)})</p>
</div>
<button>指定触发事件</button>
<script type="text/javascript">
$('p').click(function(e) {
alert(e.target.textContent)
})
//this指向button元素
$("button:eq(1)").click(function() {
$('p').click() //指定触发绑定的事件
})
</script>
<h4>测试三</h4>
<div class="test3">
<p>$('.right').click(1111, set)</p>
</div>
<button>不同函数传递数据</button>
<script type="text/javascript">
function data(e) {
alert(e.data) //1111
}
function a() {
//传值
$("button:eq(2)").click(1111, data)
}
a();
</script>
</body>
</html>
function data(e) {
alert(e.data) //1111
}
function a() {
//传值
$("button:eq(2)").click(1111, data)
}
a();
每一个<button></button>元素下对应的<script>里面定义的
function a() {
//传值
$("button:eq(i)").click(1111, data)
}
就是为每一个对应的button绑定了一个点击函数,比如$("button:eq(0)")就是第一个按钮， $("button:eq(1)")就是第二个按钮等等，他们是通过点击按钮后触发的