$(".a").eq(0).on('keyup',function(){
$('.b').eq(0).val($('.a').eq(0).val());
});
$(".a").eq(1).on('keyup',function(){
$('.b').eq(1).val($('.a').eq(1).val());
});
$(".a").eq(2).on('keyup',function(){
$('.b').eq(2).val($('.a').eq(2).val());
});
比如我想循环上述js代码,该怎么循环呢?谢谢
我自己试着写过下面这段,虽然没报错,但是无效的,keyup后a的值不会赋到b里面去。
var num=3;
if(var i=0;i<num;i++){
$(".a").eq(i).on('keyup',function(){
$('.b').eq(i).val($('.a').eq(i).val());
});
}
你提供的这段代码的运行结果应该是:
无论按了eq(0),eq(1)还是eq(2),最后都是eq(2)的值被赋给了b
这是因为变量i是var声明的,在全局范围内都有效。所以每一次循环,新的i值都会覆盖旧值,导致最后输出的是最后一轮的i的值。
解决这个问题的一个思路是用闭包,或者直接使用ES6语法用let来声明变量i。
具体可以看这篇文章
如果还是不行,请再把问题描述的仔细些,我再修改答案。
$('.a').each(function (index) {
var that = $(this);
that.on('keyup',function(){
$('.b').eq(index).val(that.val());
});
});
$(document).on('keyup','.a',function(){
_index=$('.a').index(this);
$('.b').eq(_index).val($(this).val());
});
事件处理函数其实是延迟执行函数,同时也存在闭包,所以i是等于3的,所以一般做法是采用事件委托的方式,其实也就是把点击事件给a的父元素
闭包的问题……
解决方式:
1.使用匿名包装器(立即执行匿名函数)
var num=3;
for(var i=0;i<num;i++){
(function (e) {
$(".a").eq(e).on('keyup',function(){
$('.b').eq(e).val($('.a').eq(e).val());
});
})(i);
};
2.从匿名包装器中返回一个函数
var num=3;
for(var i=0;i<num;i++){
$(".a").eq(i).on('keyup',(function(e){
return function(){
$('.b').eq(e).val($('.a').eq(e).val());
};
})(i));
};
由于没有html代码,没做测试,题主可以自行检验一下。
和这个问题类似:用for 语句遍历 li ,点击 li 当按钮用不能输出当前 li 的序号