0

HTML:

<ul id="column">
<li id="widget8">
    <div class="testhub"></div>
</li>
</ul>

JS:

if ($("#widget8").parent("#dock")) {
   $(".testhub").html("<p>dock</p>");
}
else {
    $(".testhub").html("<p>not dock</p>");
}​

CSS:

#dock {
    width: 90%;
    height: 100px;
    background-color: blue;
}
#column {
    width: 90%;
    height: 100px;
    background-color: red;
}
#widget8 {
    width: 90%;
    height: 50px;
    background-color: yellow;
}
.testhub {
    width 50%;
    height: 25px;
    background-color: black;
    color: white;
}​

http://jsfiddle.net/zVx8s/1/

我要做的就是获取li所在的ul,如果它在#dock上,然后向testhub写一些东西。但似乎不起作用,请检查 jsfiddle。

我想我错误地使用了父母。

4

5 回答 5

2

试试这个:工作演示 http://jsfiddle.net/268mh/

请注意,您永远不能在 DOM 中拥有相同的 id。所以我widget8改为上课了!

休息希望演示有助于事业!:)

代码

$(".widget8").each(function() {
    if ($(this).parent().prop("id") == "dock") {
        $(this).find(".testhub").html("<p>dock</p>");

    }
    else {
        $(this).find(".testhub").html("<p>not dock</p>");
    }
});​

HTML

<ul id="dock">
<li class="widget8">
    <div class="testhub"></div>
</li>
</ul>

<ul id="column">
<li class="widget8">
    <div class="testhub"></div>
</li>
</ul>
​
于 2012-07-27T02:25:28.560 回答
2

第一个问题是在你的小提琴上你使用 2 uls 和相同的id. 改用类。

你必须遍历你li的 s 并检查父母的长度。

$(".widget8").each(function) {
    var $element = $(this).parent("#dock");
    if($element.length > 0) {
        var message = 'dock';
    }
    else {
        var message = 'not dock';
    }
    $($element, this).html('<p>' + message + '</p>');
});

​

演示

所以如果你只是想测试是否有 id 你只需要使用正确的选择器

$('#dock .widget8').html('<p>dock</p>');

#dock上面的选择器获取内部且具有类的元素.widget8

演示

于 2012-07-27T02:32:16.347 回答
1

你忘length了检查它是否真的存在。

if ($("#widget8").parent("#dock").length)
                                 ---^---
于 2012-07-27T02:22:42.187 回答
1

问题是这个表达式:

$("#widget8").parent("#dock")

计算结果为 jQuery 对象,并且对象在 JavaScript 中始终是“真”值。(总是. Evennew Boolean(false)是一个“真”值。)

要查看上面的 jQuery 对象是否包含任何实际元素,可以使用.length属性

if ($("#widget8").parent("#dock").length) {

(但我同意杰夫的观点,写得更清楚parent().is("#dock"):获取父级,检查它是否是#dock,而不是获取父级,如果它是- #dock,看看它是否存在。)

于 2012-07-27T02:24:10.510 回答
0

如果你想测试 parent id,你可以使用这个:

if ($("#widget8").parent().is("#dock")) {
    $(".testhub").html("<p>dock</p>");
}
else {
    $(".testhub").html("<p>not dock</p>");
}​
于 2012-07-27T02:21:37.900 回答