jquery 给元素添加了一个class,然后给添加的class绑定点击事件
发布时间:2015-11-11, 09:18:12 分类:HTML | 编辑 off 网址 | 辅助
正文 2071字数 561,102阅读
你在添加更多一行的时候所产生的 input 和 button 都是动态生成的,所以不能使用 click,要使用 live (jquery 1.7.2 之后的版本不建议使用 live) 或 on把
$(".submitBtn").click(function(){
改为
$(".submitBtn").live('click', function(){
或者
$(".submitBtn").on('click', function(){
记住如果元素在页面初始化的时候不存在,而是之后通过动态生成在页面中的,要对这些元素进行操作,例如 click, blur, keyup, change....,都要使用 on
.on('click', function
.on('blur', function
.on('keyup', function
....
点击失效是因为绑定元素是自身,后面改绑定父元素即可
function nxu(n){
location.href = '/'+n+'.html';
}
function nxunxu(){
location.href = '/s.html';
}
(function($){
oid=0;
odiv=0;
arr=[];
n=1;
$('.mainimg').on('click','.immg',function(){
if(n==2) return false;
var jj=$(this).attr('data-src');
var tid=$(this).attr('data-id');
//alert(tid);
$(this).css('visibility','hidden');
$('#d'+tid).addClass('ltime');
$('#d'+tid).timer({format: "HH:MM:ss.SSS"});
if(!odiv) odiv=$('#iq'+tid).html();
if(!oid) oid=tid;
if(tid!=oid){
$('#iq'+oid).html(odiv);
//alert(odiv);
}
var a=arr.indexOf(tid);
if(a==-1){
$.ajax( {
url: '/?qs='+jj,
type: 'GET',
cache: true,
beforeSend: function(){
n=2;
},
success: function(data){
var nhh=$('#iq'+tid).height()+'px';
$('#iq'+tid).css('height',nhh);
$('#iq'+oid+' .immg').css('visibility','');
$('#iq'+oid+' .immg').attr('src','/0.gif');
$('#iq'+oid+' .immg').attr('height','100%');
oid=tid;
arr.push(tid);
n=3;
odiv=$('#iq'+tid).html();
$('#iq'+tid).html(data);
}
});
}else{
data='<img src="'+jj+'" style="cursor: none;" />';
var nhh=$('#iq'+tid).height()+'px';
$('#iq'+tid).css('height',nhh);
$('#iq'+oid+' .immg').css('visibility','');
$('#iq'+oid+' .immg').attr('src','/0.gif');
$('#iq'+oid+' .immg').attr('height','100%');
oid=tid;
arr.push(tid);
odiv=$('#iq'+tid).html();
$('#iq'+tid).html(data);
}
//$(this).attr('src',jj);
//alert(this);
});
})(jQuery);
Run code
Cut to clipboard
(支付宝)给作者钱财以资鼓励 (微信)→
有过 2 条评论 »
支持给动态元素和属性绑定事件的是live和on,其中live在JQUERY 1.7之后就不推荐使用了。现在主要用on,使用on的时候也要注意,on前面的元素也必须在页面加载的时候就存在于dom里面。动态的元素或者样式等,可以放在on的第二个参数里面。
下面看下jquery on() 方法绑定动态元素
jQuery on()方法是官方推荐的绑定事件的一个方法。使用 on() 方法可以给将来动态创建的动态元素绑定指定的事件,例如append等。
<div id="test">
<div class="evt">evt1</div>
</div>
错误的用法,下面方法只为第一个class 为 evt 的div 绑定了click事件,使用append动态创建的div则没有绑定
<script>
// 先绑定事件再添加div
$('#test .evt').on('click', function() {alert($(this).text())});
$('#test').append('<div class="evt">evt2</div>');
</script>
正确的用法如下:
<script> $('body').on('click', '#test .evt', function() {alert($(this).text())}); $('#test').append('<div class="evt">evt2</div>'); </script>
以上所述是小编给大家介绍的jQuery on()方法绑定动态元素的点击事件无响应的解决办法
code
code
支持给动态元素和属性绑定事件的是live和on,其中live在JQUERY 1.7之后就不推荐使用了。现在主要用on,使用on的时候也要注意,on前面的元素也必须在页面加载的时候就存在于dom里面。动态的元素或者样式等,可以放在on的第二个参数里面。
下面看下jquery on() 方法绑定动态元素
jQuery on()方法是官方推荐的绑定事件的一个方法。使用 on() 方法可以给将来动态创建的动态元素绑定指定的事件,例如append等。
<div id="test">
<div class="evt">evt1</div>
</div>
错误的用法,下面方法只为第一个class 为 evt 的div 绑定了click事件,使用append动态创建的div则没有绑定
<script>
// 先绑定事件再添加div
$('#test .evt').on('click', function() {alert($(this).text())});
$('#test').append('<div class="evt">evt2</div>');
</script>
正确的用法如下:
<script> $('body').on('click', '#test .evt', function() {alert($(this).text())}); $('#test').append('<div class="evt">evt2</div>'); </script>
以上所述是小编给大家介绍的jQuery on()方法绑定动态元素的点击事件无响应的解决办法
code
code