jQuery-如何计算子项并应用基于百分比的宽度

Question

How can I use jQuery to count the number of child elements (in this case list elements) inside div id #foo and then divide 100 / (# of counted child elements). 我如何使用jQuery来计算div id #foo中的子元素（在这种情况下为列表元素）的数量，然后除以100 /（已计数的子元素数量）。 The last step would be to apply that as a percentage based width 最后一步是将其应用为基于百分比的宽度

<style="width: Npx">

Where N = [100/(# of child elements)]? N = [100 /（子元素数）]？

Answer 1

$('someelement').width((100 / $('#foo').find('li').length));

您应该检查.length是否为零，以避免被零除。

Answer 2

Try this(it takes care of case when there are not children in foo): 尝试以下操作（在foo中没有子节点的情况下，要注意大小写）：

var el = $('#foo');
var len = el.children().length;
if(len > 0){
    len = 100/len;
    el.css("width",  len + "px"); 
}

Answer 3

var count = $('#foo > *').length;
$('#bar').css({width:(100/count)+'%'});

Answer 4

<html>
<head>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.4.min.js" 
type="text/javascript"></script>
</head>
<body>
    <div id="foo">
        <ul>
            <li>Baseball</li>
            <li>Basketball</li>
            <li>Football</li>
            <li>Soccer</li>
            <li>Hockey</li>
        </ul>
    </div>
    <script type="text/javascript">
        $(function () {
            var sWidth = "auto";
            var liLength = $("#foo li").length;
            alert(liLength);
            if (liLength > 0) {
                sWidth = (100 / liLength) + "%";
            }
            $("#foo").width(sWidth);
            alert(sWidth);
        });
    </script>
</body>
</html>

jQuery-如何计算子项并应用基于百分比的宽度

问题描述

4 个解决方案

解决方案1
3 2011-01-24 23:27:52

解决方案2
2 已采纳 2011-01-24 23:30:03

解决方案3
1 2011-01-24 23:27:28

解决方案4
0 2011-01-24 23:42:48

jQuery-如何计算子项并应用基于百分比的宽度

问题描述

4 个解决方案

解决方案1 3 2011-01-24 23:27:52

解决方案2 2 已采纳 2011-01-24 23:30:03

解决方案3 1 2011-01-24 23:27:28

解决方案4 0 2011-01-24 23:42:48

解决方案1
3 2011-01-24 23:27:52

解决方案2
2 已采纳 2011-01-24 23:30:03

解决方案3
1 2011-01-24 23:27:28

解决方案4
0 2011-01-24 23:42:48