使用jQuery从$(this)位置选择下一个元素

Question

我有以下代码片段在我的页面中：

我有以下代码片段在我的页面中：

<div class="radio-group">
<input type="radio" name="group1" checked="checked" id="option1" value="option1"/>
<label for="option1">option1</label>
<input type="radio" name="group1" id="option2" value="option2"/>
<label for="option2">option2</label>
<input type="radio" name="group1" id="option3" value="option3"/>
<label for="option3">option3</label>
<input type="radio" name="group1" id="option4" value="option4"/>
<label for="option4">option4</label>
</div>

这是选取单选按钮后隐藏输入框的 JavaScript 代码：

$("input[type='radio']").live("change", function () {        
    var el = this.parentNode.nextElementSibling;
    el.value = this.value;
});

我想要写这行代码

var el = this.parentNode.nextElementSibling;

以jQuery的方式。谢谢。

- Beetlejuice

Answer 1

var el = $(this).parent().next().find("input[type='radio']");
el.val(this.value);

非常简单。 :)

编辑

呵呵，没有足够注意标记。:P 已修复。

- Joseph Marikle

---

以上代码将选择this的下一个兄弟节点，而不是像OP的代码那样选择this.parentNode的下一个兄弟节点！ - Jon

@Jon 在被踩之后看到了这个问题 :P 但还是感谢你指出来。已经修复了。 - Joseph Marikle

@Jon 哦，我并没有假设那个，但是我真的不介意被踩一下，因为这让我回去看了一下 :P - Joseph Marikle

Answer 2

$("input[type='radio']").live("change", function () {        
    var el = $(this).parent().next();
    el.val(this.value);
});

- bjornd

---

使用el.val(this.value);，因为el是一个jQuery元素。然而，如果元素被选中或未选中，this.value都不包含任何信息！ - ThiefMaster

Answer 3

var el = this.parentNode.nextElementSibling;

翻译为

var $el = $(this).parent().next();

- Jon

Answer 4

使用jQuery的this，还要注意可以过滤下一个选择器（以防您的代码出现问题）

var el = $(this).next('input[type="hidden"]');

- mreq

---

我喜欢这种风格，但是用它没有得到任何结果。 - Beetlejuice