码迷,mamicode.com
首页 > Web开发 > 详细

jQuery的事件绑定

时间:2020-02-18 12:47:03      阅读:87      评论:0      收藏:0      [点我收藏+]

标签:this   继承   bin   http   click   tle   var   title   end   

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Title</title>
<meta charset="UTF-8">

</head>
<body>
<p>star</p>
<!---->
<ul>
<li>111</li>
<li>222</li>
<li>333</li>
<li>444</li>
</ul>
<!---->
<input value="+" type="button" onclick="add()">
<script src="jquery-3.4.1.js"></script>
<script>
//1.click事件绑定(可以绑定多个标签)
// $(‘p‘).click(function () {
// alert($(this).css(‘color‘,‘red‘)) //star变红
// alert(this.innerHTML)// star

// })
//=========================================================
//2.bind事件绑定--(用click触发)
// $(‘p‘).bind(‘click‘,function () {
// alert(this.innerHTML);//star
//
// })
//=========================================================
//3.用该方法绑定的事件不能被添加的新标签继承
// $(‘ul li‘).click(function () {
// alert(123);
// });
//=========================================================
//4.用该方法绑定的事件可以被添加的新标签继承(事件委托)
//给动态标签绑定事件的方法用on
// $(‘ul‘).on(‘click‘,‘li‘,function () {
// alert(‘position‘)
// });
//=========================================================
//同bind方法
// $(‘ul li‘).on(‘click‘,function () {
// alert(‘position‘)
// });//如果没有select,那么这样跟bind方法是一样的
//=========================================================
//5.on方法中的 [data]参数(用event调用data对象)

function show(event){
alert(event.data.f1);//star come up
}
$(‘p‘).on(‘click‘,{f1:‘star come up‘},show);


function add() {
var tag=document.createElement(‘li‘);
tag.innerHTML=‘?‘;
$(‘ul‘).append(tag);

}

</script>

</body>
</html>

jQuery的事件绑定

标签:this   继承   bin   http   click   tle   var   title   end   

原文地址:https://www.cnblogs.com/startl/p/12325583.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!