jquery中$each()

$.each()：可用于遍历任何的集合(无论是数组或对象)

$(selector).each()：专用于jquery对象的遍历,

如果是数组,回调函数每次传入数组的索引和对应的值(值亦可以通过this 关键字获取,但javascript总会包装this 值作为一个对象—尽管是一个字符串或是一个数字),方法会返回被遍历对象的第一参数.

each的几种常用的用法

①一维数组：var arr1 = [ "aaa", "bbb", "ccc" ];

$.each(arr1, function(i,val){

    alert(i);

    alert(val);

});
alert(i)将输出0，1，2
alert(val)将输出aaa，bbb，ccc

②一维数组：var arr2 = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']]

$.each(arr2, function(i, item){

    alert(i);

    alert(item);

});

//arr2为一个二维数组，item相当于取这二维数组中的每一个数组。

//item[0]相对于取每一个一维数组里的第一个值

alert(i)将输出为0，1，2，因为这二维数组含有3个数组元素

alert(item)将输出为 ['a', 'aa', 'aaa']，['b', 'bb', 'bbb']，['c', 'cc', 'ccc']

$.each(arr, function(i, item){

　　$.each(item,function(j,val){

　　　　 alert(j);

　　　　alert(val);

　});

});

alert(j)将输出为0，1，2，0，1，2，0，1，2

//将会输出每个数组的每个值

alert(val)将输出为a，aa，aaa，b，bb，bbb，c，cc，ccc

实例：动态生成树

后台返回的是一个二维数组

<div class="wrapper wrapper-content animated fadeInRight">

        <div class="row">

            <div class="col-lg-12">

                <div class="ibox float-e-margins">

                    <div class="ibox-content">

                        <ul class="nav" id="menus">

                        </ul>

                        <span id="liMsg"></span>

                    </div>

                </div>

            </div>

        </div>

</div>

<script type="text/javascript">

             $(document).ready(function () {

                 jQuery.ajax({

                     type:'POST',

                     url: '/ZAdmin/MenuHandler.ashx',

                     data: {action:'rootMenu'},

                     dataType:'json',

                     success: function (data) {

                         if (data.Status == 200) {

                             var htmlLi = "";

                             $.each(data.Data, function (i, item) {

                                 htmlLi +='<li>';

                                 $.each(item, function (j, val) {

                                     if (j == 'menu_name') {

                                         htmlLi+='<a>' + val + '</a>';

                                     }

                                 });

                                 htmlLi+='</li>';

                                 $('#menus').html(htmlLi);

                             });

                         } else {

                             $('#liMsg').text('异常');

                         }

                     },

                     error: function (errorThrown) {

                         jQuery('#liMessage').val('网络通讯异常');

                         return false;

                     }

                 })

             });

</script>

这块遇到一个问题，由于我是动态拼数据，当我用append()时，不能追加到临时变量上，试了很多方法，转成jquery对象也不行

后来只能把动态生成的数据写在临时变量中然后用html()往里插入

巴特西

jquery中$each()

最新文章

热门文章