如何使用javascript在div上设置相等的宽度

Question

我有五行看起来像这样:它是带有lis的ul.我希望第一个li"text"在所有行上都相等.要做到这一点,我需要寻找最宽的li,然后将新的应用于所有li.

(ul> li> span&ul)

文字>李1 | li 2 | Li 3
Textlong> Li 1 | li 2 | 李3
短>李1 | li 2 | Li 3
Longer13456> Li 1 | li 2 | 李3

我使用以下功能来设置相同的高度.修改了一下.但它没有任何意义!

function equalWidth() {
    var span = $('#tableLookAlike li.tr > span'),
        tallest = 0, 
        thisHeight = 0;

    setEqWidth = function(elem) {
        elem.each(function() {
            widest = 0;
            thisWidth = $(this).outerWidth();
            console.log(tallest, thisWidth)



// if I remove this it gives me the right width
                elem.each(function() {Width)
                    if (thisWidth > widest) {
                        widest = thisWidth;
                        elem.css({'width': widest});
                    }
                });
            });
        }

        setEqWidth(span);
    }

当我删除第二个elem.each时,日志显示92,69,68,118,当我把它放回去时,它给了我92,130,168,206.有谁知道这里发生了什么？

艾恩,我该如何解决这个问题？

Answer 1

如果我这样做,它会是这样的:

var greatestWidth = 0;   // Stores the greatest width

$(selector).each(function() {    // Select the elements you're comparing

    var theWidth = $(this).width();   // Grab the current width

    if( theWidth > greatestWidth) {   // If theWidth > the greatestWidth so far,
        greatestWidth = theWidth;     //    set greatestWidth to theWidth
    }
});

$(selector).width(greatestWidth);     // Update the elements you were comparing

Answer 2

function equalWidth() {
    var span = $('#tableLookAlike li.tr > span'),
        widest = 0,
        thisWidth = 0;

    setEqWidth = function(elem) {
        widest = 0;
        elem.each(function() {
            thisWidth = $(this).outerWidth();

            if (thisWidth > widest) {
                widest = thisWidth;
            }
        });

        elem.css({ 'width': widest });
    }
    setEqWidth(span);
}