|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
对相应的代码做一些简单的修改,就可以改变同一页面的不同部分,或者页数不同的网页的外观和格式。
破洛洛文章简介:间接用click不克不及为静态元素绑定click事务。
1.呈现成绩:
我们一样平常都是为已存在的元素往绑定事务,那末用一样的绑定办法也能准确绑定静态创立的元素吗?
我在我们孔明app的项目里静态创立了一个元素,然后我又必要为这个元素绑定事务,要点击这个静态创立的元素的时分可以在这个元素的右边复制这个元素出来
$("静态创立的元素").click(function(){
console.log("事务已被绑定");
....
}
但是我用却没有半点反响,作为测试用的console语句的话不就是没出来过,厥后经同事提点:你这个(绑定事务的)元素是否是静态创立的?
我就奇异了,静态创立的元素用click事务绑定就不可了吗?
2.成绩剖析:
我换了on来绑定事务,了局仍是不可(厥后发明不是不可,而是on绑定这类静态元素得绑定在这个静态元素的父元素大概祖父元素上,再把这个静态元素作为参数传出来),on事务不可了,又入手下手试live这个绑定事务,ok,在live这里,绑定乐成,测试的console语句出来了,看看api,出格有指出,本来live是能够为如今还未创立的静态元素绑定事务的,而bind事务则只能绑定已存在的元素。
好吧,未几说了上Code吧。
<!doctypehtml>
<html>
<head>
<title>测试怎样绑定静态元素的具体情形</title>
<body>
<divid="container">
<buttonid="addSpan">增加元素</button>
</div>
<pid="disc">提醒语句</p>
<scriptsrc="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<scripttype="text/javascript">
$("#addSpan").click(function(){
$("#container").append($("<buttonid=clickAddEle>click事务</button>"));
$("#container").append($("<buttonid=bindAddEle>bind</button>"));
$("#container").append($("<buttonid=liveAddEle>live</button>"));
$("#container").append($("<buttonid=onAddEle>on</button>"));
});
//用click办法绑定
$("#clickAddEle").click(function(){
vartiscContent="click为静态元素绑定事务乐成1";
$("#disc").html(tiscContent);
});
$("#bindAddEle").bind("bind",function(){
vartiscContent="bind为静态元素绑定事务乐成1";
$("#disc").html(tiscContent);
});
$("#liveAddEle").live("click",function(event){
vartiscContent="live为静态元素绑定事务乐成1";
$("#disc").html(tiscContent);
});
/*
$("#liveAddEle").on("click",function(event){
vartiscContent="on为静态元素绑定事务乐成1";
$("#disc").html(tiscContent);
});
*/
$("#container").on("click","#onAddEle",function(event){
vartiscContent="on为静态元素绑定事务乐成1";
$("#disc").html(tiscContent);
});
</script>
</body>
</head>
</html>
这里的demo你点击"增加元素"按钮后,会静态创立几个按钮,分歧的按钮对应分歧的办法,假如你点击了谁人按钮后,上面的形貌笔墨有更新就申明你的这个按钮所代表的绑定事务的办法是泅水的。
注重,on办法是jQuery1.7才增加出来的办法,以是假如你的jQuery版本低于这个,那末on办法就会不起感化。
3.成绩总结:
为静态元素绑定事务的话,用click(),bind(),间接为这个元素绑定on()都不可,要用live(),大概给这个元素的下级元素绑定on办法,把这个元素作为参数传出来才行。
</p>
表现和内容相分离。将设计部分剥离出来放在一个独立样式文件中,你可以减少未来网页无效的可能。 |
|