JQuery如果任何类的宽度大于0

时间:2013-07-04 08:47:40

标签: jquery

这是我尝试过的事情

    if($('modal').css(width) > 0)

尝试编写一个简单的if语句来检查“modal”类的宽度是否大于0的任何元素。

编辑:这写得很糟糕,对不起。以下是我知道我必须做的事情:

我需要在DOM树中迭代所有带有类.modal的元素,并确保它们都没有大于0的宽度。我想在这种情况下我可以设置一个for循环来设置带有.modal类的任何东西的所有宽度为0。

知道了!这是有效的:

 $(".modal").width(function(i, w) { return w * 0 });

感谢大家的帮助!

1 个答案:

答案 0 :(得分:0)

您可以使用此代码查找某个组的项目ID(使用类似“.modal”的jquery选择器),其宽度大于1(为了安全起见,我使用的是1而不是0)。

作为一个例子我使用过:

    <div id="a" class="modal">aaaa</div>
    <div id="b" class="modal"></div>
    <div id="c" class="modal">cccc</div>
    <div id="d" class="modal"></div>

在CSS中使用.modal {float:left}(否则所有元素都具有相同的宽度)。 您可以使用if(testIfItemsWithWidth(".modal")) {...}来测试至少一个的存在。

    $(function() {
        if(testIfItemsWithWidth(".modal")) {
            alert("YES");
        }
    })



    function testIfItemsWithWidth(classes) {
        var foundOne=false;
        $(classes).each(function(cnt,itm) {
            if($(this).width()>1) {
                foundOne=true;
            }
        });
        return foundOne;
    }

TRY HERE

如果你想做更好的事情:

    $(function() {
        var items=getItemsWithWidth(".modal");
        for(var i=0;i<items.length;i++) {
            // as an example, display id in dialog and set their border to red
            alert(items[i]);
            $("#"+items[i]).css({"border":"1px solid red"});
        }
    })

    function getItemsWithWidth(classes) {
        var itemList=[];
        $(classes).each(function(cnt,itm) {
            if($(this).width()>1) {
                itemList.push($(this).attr("id"));
            }
        });
        return itemList;
    }

TRY HERE

或者更好,您可以使用JQuery过滤功能:

    $(function() {
        var $items=$(".modal").filter(function(idx) {
            return ($(this).width()>1);
        }).css({"border":"1px solid red"});
    })

这只是将边框颜色设置为红色作为示例。

TRY HERE