Question

如何使用jQuery计算div id #foo中的子元素数（在本例中为list元素），然后除以100 /（计算的子元素数）。最后一步是将其应用为基于百分比的宽度

<style="width: Npx">

其中N = [100 /（子元素数）]？

Answer 1

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

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

Answer 2

试试这个（它会照顾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 个答案: