您的位置:首页 > Web前端 > JQuery

jquery的$().each,$.each的区别

2016-08-02 14:42 501 查看
在jquery中,遍历对象和数组,经常会用到$().each和$.each(),两个方法。两个方法是有区别的,下面为大家介绍一下它们的具体用途:

一、$().each(function(){}):

 
     对于这个方法,在Dom处理上面用的较多。如果页面有多个input标签类型为checkbox,这时可以用$().each来处理多个checkbook

例如:我们要实现的功能效果如下:



 
    当我们勾选好复选框之后,我们点击保存按钮,当我们再次打开这个页面进行查看的时候它能够记住之前选中的复选框:能看见的效果如下



页面代码如下:

<td class="input">
<input type="hidden" name="FIELD_26" id="FIELD_26" value="${tbdata.tbdetail.FIELD_26}">
<input type="checkbox" name="ck_FIELD_26" onclick="click_ck26(this)" value="1">基层卫生医疗系统     
<input type="checkbox" name="ck_FIELD_26" onclick="click_ck26(this)" value="2">公共卫生系统
</td>


js代码:
$(document).ready(function() {
var ck26Options = $("#FIELD_26").val().split(";");
$("input[name='ck_FIELD_26']").each(function(){
for(var i = 0; i < ck26Options.length; i ++){
if($(this).val() == ck26Options[i]){
$(this).attr("checked","true");
break;
}
}
});

function click_ck26(o){
var value = "";
var options = document.getElementsByName("ck_FIELD_26");
for(var i = 0; i < options.length; i ++){
if(options[i].checked){
value += options[i].value + ";";

}
}

$("#FIELD_26").val(value);
}
1、当我们选中两个复选框的时候,会调用click_ck26(o)函数,获取values的值为:"1;2;"

2、然后将id=FIELD_26的input输入框的value的值赋值为values,

3、点击保存的时候将id=FIELD_26的输入框的value值("1;2;")存入数据库FIELD_26字段对应的值

1、当我们选中两个复选框的时候,会调用click_ck26(o)函数,获取values的值为:"1;2;"

2、然后将id=FIELD_26的input输入框的value的值赋值为values,

3、点击保存的时候将id=FIELD_26的输入框的value值("1;2;")存入数据库FIELD_26字段对应的值



 
4、当我们再次查看这个页面的时候,从数据库出去FIELD_26字段对应的值,利用字符串分割函数获取到字符数组{‘1’,‘2’}

 
5、将字符数组里面的每个value值对应的复选框设置为选中状态,就完成了。

总结(1):

如果页面有多个input标签类型为checkbox,对于这时用$().each来处理多个checkbook,例如:

$(“input[name=’ck_FIELD_26']”).each(function(i){

if($(this).attr(‘checked’)==true){//一些操作代码

}

回调函数索引是可以传递参数,i就为遍历的。
一、$.each(function(){}):
 
   对于遍历一个数组,用$.each()来处理

例如:

var obj = { one:1, two:2, three:3, four:4, five:5 };
$.each(obj,function(key,val){
alert(obj[key]);
})
输出:1   2  3  4  5
var arr2 = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]
$.each(arr2, function(i, item){
alert(item[0]);
});

输出:1  4  7

var arr1 = [ “one”, “two”, “three”, “four”, “five” ];
$.each(arr1, function(){
alert(this);
});


输出:one   two  three  four   five
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: