jQuery的复选框的问题

我继承了下面的代码片段：jQuery的复选框的问题

<div id="topbox"> 
    <h3> 
     <div class="compare_link">Compare Products</div> 
    <input type="checkbox" id="compare_123" name="chkcompare[]" value="123" /> 
    </h3> 
</div>

我试图搞清楚的是：

我想找到有compare_link和HTML复选框儿童全部H3选择并将该复选框向下移动10个像素。

我知道我可以用jQuery找到复选框，但是如果兄弟是compare_link，我可以这么做吗？

我无法访问部分代码，因此我无法将自己的复选框向下移动。

来源

2010-10-02 coson

你不需要jQuery。你可以用CSS来做到这一点。但是，浏览器支持可能有所不同

h3 > div.compare_link + input[type="checkbox"] { 
    margin-top: 10px; 
}

如果你想使用jQuery，它需要CSS选择器。所以下面应该工作：

$('h3 > div.compare_link + input[type="checkbox"]')

来源

2010-10-02 20:37:30

你只是要求选择器？

$('h3 > .compare_link + :checkbox')

来源

2010-10-02 20:36:15 Thomas

用好直接子选择器。 – 2010-10-02 20:38:18

是的，因为一旦元素被选中，那么我应该可以设置CSS。你对直接孩子选择者的评论意味着什么？ – coson 2010-10-02 20:53:14

在大多数情况下使用的灵活性：

$('h3 div.compare_link').siblings('input:checkbox')

这将选择与该compare_link类的div的同级所有复选框。 div与compare_link类必须是h3标记的后代。

的优点是，这个工程即使复选框移动的div盈或另一格放置在中间，或者如果compare_link格被包裹在另一个DIV等..

来源

2010-10-02 22:47:18

jQuery的复选框的问题

回答

相关问题