jquery遍歷獲取帶checkbox表格的選中值以及遍歷json數組

今天整理了一下jquery遍歷的兩個用法，分享給大家。

1.$().each 主要用來遍歷DOM元素，獲取DOM的值或樣式等。

2.$.each() 主要用來遍歷后台ajax返回的json數組，循環將數組的值賦予DOM元素等。

 

$().each。上代碼：

<button id="get_category">獲取單選框分類名稱</button>
<tbody>
    <tr>
         <td><input type="checkbox" name="ckb" value="分類一"></td>
         <td>分類一</td>
    <tr> 
    <tr>
         <td><input type="checkbox" name="ckb" value="分類二"></td>
         <td>分類二</td>
    <tr> 
</tbody>  

JS代碼：

$("#get_category").on('click',function(){
    var checkids = [];
    $("input[name='ckb']:checked").each(function(i){
        checkids[i] = $(this).val();
    });
    alert(checkids);
});

點擊按鈕，你就會發現被選中行的分類名稱就可以alert出來。

 

$.each() 上代碼：

$.get("{:U('Record/Index')}",{info:info},function(data){
    $.each(data, function(i, item){ 
          alert(item.name+item.tel)
    });
});    

該段JS代碼，第一行為發送ajax請求，info為發送數據，這些都不需要理解，只需要清楚data為ajax返回值，假設返回的data數組有"name"和"tel"兩個鍵值，那么通過$.each()就可以將data中的所有數組元素alert出來。其中i為循環值，循環一次自動加1，item為數組中的元素。當然，i和item沒有固定的寫法，你也可以寫成 function(a, ele)等任何形式。

 

jquery還有很多內置好的遍歷方法，parent()、children()、find()、siblings()等，很常用，用法也很簡單，都可以在下面的菜鳥教程鏈接查到，這里就不一一介紹了。

https://www.runoob.com/jquery/jquery-ref-traversing.html

 如有不正確之處，歡迎大家交流指正。