0

我正在努力学习更好地构建我的代码,并在学习了一些教程后开始使用下面的模式。

我以这种方式构建了许多常见的 UI 小部件已经取得了相当大的成功,尽管我已经碰到了我的第一堵墙,下面的 .each() 循环似乎实际上并没有遍历每个项目,而是应用了所需的就像它在一次迭代中作用于所有项目一样。

我读过一些关于 $.each 和 objects 的东西,虽然我不确定 $.each,甚至它是否是我应该去的方向。

jQuery(document).ready(function($) {

var tabs = {

    trig : $('nav.tab-triggers'),
    content : $('section.tabs-content'),

    init : function() {
        tabs.address([tabs.trig]);
        tabs.address([tabs.content]);
    },

    address : function(item) {
        //for every instance of the item

        $(item).each(function() {
            var i = 1;
            $(this).addClass('tabs-' + i);

            // for ever child element in this instance of the item
            $(this).children().each(function() {
                var count = 1;
                if ( $(this).parent().is('nav') ) {
                    $(this).attr('href', '#tab-' + count);
               } else {
                    $(this).attr('id', 'tab-' + count);
               }

                count++;

            });

            i++;
        });
    },

    display : function () {
        //show hide stuff here.
    }


}

tabs.init();

});
4

1 回答 1

0

所以经过多次试验和错误,我终于让它工作了。

基本上,据我了解,我正在尝试迭代嵌套对象,因此 .each 需要替换为 $.each 方法,其工作方式略有不同。

    address : function(obj) {
        // for each obj
        $.each(obj, function(index,value) {
            //for each instance of the trigger / content item in the obj
             $.each(obj[index], function(index2,value2) {
                //add an incrementing class for each matched element
                $(value2).addClass('tabs-' + index2);
                // get the children of each matched element
                var kids = $(value2).children();
                // loop through each of the children
                $.each(kids, function(index3, value3) {
                    // if its parent is a nav element
                    if ( $(value3).parent().is('nav') ) {
                        // add href
                        $(value3).attr('href', '#tab-' + index3);
                    } else {
                        // add matching ids
                        $(value3).attr('id', 'tab-' + index3);
                    }


                });  // end loop through children elements
             }); // end loop through parent elements
        }); // iteration of passed obj
    }, // end address method

这就是新方法——有效。有一个更好的方法吗 ?

于 2013-01-16T07:38:46.990 回答