jQuery 循环数字值添加事件

有4个TAB的DIV和4个显示TAB内容的DIV,绑定了ID 就是page_id
var page_id = ['info','parameter','comment','diy'];
function Tab_(j){
for( i=0; i < page_id.length ; i++){
$('#page_'+page_id[i]).hide();
}
$('#page_'+page_id[j]).show();
}
$(document).ready(function(){
for(i=0;i<page_id.length;i++){
alert(i);
$('#tab_'+page_id[i]).bind('click',function(){Tab_(i);});
}
Tab_(0);
});
ready用alert调试,结果全部正常,是0,1,2,3 但是到了绑定里面,全部都是4了,为什么那么说呢,因为在Tab_里面也放了alert j值都是4,这是为什么?代码没写错呀

方法如下:
1.页面载入完毕响应事件
所谓页面载入完毕是指DOM元素载入就绪了,能够被读取和操作了。
①jQuery中的$(doucument).ready()事件
ready(fn)是jQuery事件模块中最重要的一个函数。这个方法可以看作是对window.onload注册事件的替代方法。通过使用这个方法,可以在DOM载入就绪时立刻调用所绑定的函数,而几乎所有的javaScript函数都是需要在那一刻执行。
ready(fn) 返回值:Object 参数-fn:要在DOM载入就绪时执行的参数Function 当DOM载入就绪时绑定一个要执行的函数
而它有一种很简单的缩写形式$(document).ready(function(){}) => $(function(){})
②window.onload()事件和$(document).ready()事件的比较
window.onload()=function(){}
如果使用多个window.onload(),则只有最后一个绑定的函数能被执行,它将覆盖前面所有window.onload()绑定的函数。
如果使用多个$(),则它们都能被执行。
需要注意的是如果<body onload> body标签的onload事件已经注册了某个函数 则$()事件注册的函数将不会被执行

2.绑定与反绑定事件监听器
①绑定事件
⑴bind(type,[data],fn)函数
就是将某函数与某元素的某事件绑定在一起 $("#id").click(function(){})就是将一个匿名函数与id元素的click事件绑在一起
但上面的例子其实只是缩写形式,因为其是简单常用的事件绑定,正规写法应如下:
$("#id").bind("click",[data],function(){})
bind(type,[data],fn) 返回值:Object 参数-type:事件类型String data:可选,作为event.data属性值传递给后面fn的实参Object fn:绑定到事件上的函数Function
⑵为处理函数传递参数
这里用到bind()函数的第二个参数及event.data属性为fn函数传递参数

代码如下:
<input id="Text2" type="text" />
$("#Text2").bind("click",{first:"1",second:"2"},function(event){
if(event.data.first=="1"){$(this).val("欢迎光临")}
if(event.data.second=="1"){$(this).val("")}
});
})
温馨提示:答案为网友推荐,仅供参考
第1个回答  推荐于2016-03-10
试下这样,未测试
$(document).ready(function(){
for(i=0;i<page_id.length;i++){
alert(i);
eval("$('#tab_"+page_id[i]+"').bind('click',function(){Tab_("+i+");});");
}
Tab_(0);
});本回答被提问者采纳