Question

这段代码有什么问题？根据条件，我想设置一个双棕色边框或一个纯蓝色边框，但无论我使用什么条件都无关紧要：if($(this).has("#tt"))或if(($(this).has("ssssssss")))或其他什么，它始终保持双棕色边框...

Jquery的：

$(document).ready(function () {
    $(".divvv").wrap(function () {
        if ($(this).has("#tt")) {
            return $("<div/>").css("border","double thick brown")
        }
        else {
            return  $("<div/>").css("border","solid blue")
        }
    })
})

HTML：

<div id="firstdiv" class="divvv">
 <label class ="lab" id="tt" for="two">2</label>
    <input type="checkbox" value="2" id="two" />
    <label class ="lab" for="four">4</label>
    <input type="checkbox" value="4" id="four" />
</div>

 <div class="divvv" id="secdiv">
<button id="bu">Here</button><button id="bubu"> Button</button>
    <label id="second">This is the <span style="color:aqua">second</span> label</label>
    <label>This is the third label</label>
        </div>

Answer 1

试试这个：.has()返回一个对象而不是真或假。如果匹配对象，则可以使用返回1的.has().length，否则为0，即为0。见下面的代码

$(document).ready(function () {
    $(".divvv").wrap(function () {
        if ($(this).has("#tt").length) {
            return $("<div/>").css("border","double thick brown")
        }
        else {
            return  $("<div/>").css("border","solid blue")
        }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="firstdiv" class="divvv">
 <label class ="lab" id="tt" for="two">2</label>
    <input type="checkbox" value="2" id="two" />
    <label class ="lab" for="four">4</label>
    <input type="checkbox" value="4" id="four" />
</div>

<div class="divvv" id="secdiv">
    <button id="bu">Here</button><button id="bubu"> Button</button>
    <label id="second">This is the <span style="color:aqua">second</span> label</label>
    <label>This is the third label</label>
</div>

Answer 2

使用：

$(document).ready(function () {
    $(".divvv").wrap(function () {
        if ($(this).has("#tt").length) {
            return $("<div/>").css("border","double thick brown")
        }
        else {
            return  $("<div/>").css("border","solid blue")
        }
    })
})

<强> HTML

<div id="firstdiv" class="divvv">
 <label class ="lab" id="tt" for="two">2</label>
    <input type="checkbox" value="2" id="two" />
    <label class ="lab" for="four">4</label>
    <input type="checkbox" value="4" id="four" />
</div>

 <div class="divvv" id="secdiv">
<button id="bu">Here</button><button id="bubu"> Button</button>
    <label id="second">This is the <span style="color:aqua">second</span> label</label>
    <label>This is the third label</label>
        </div>

.has（）每次返回一个对象是否存在匹配，但是.has（）。长度返回0表示没有匹配，返回1表示匹配。

DEMO

使用函数作为参数的wrap方法

2 个答案: