jquery - 使用JQuery获取 sibling

Question

我正在尝试获取下面的 a 标记以从选择中获取值并将其粘贴到输入中。

<td class="ms-formbody" style="width:385px">
    <input name="ctl00$PlaceHolderMain$dlFields$ctl00$txtSource" type="text" id="ctl00_PlaceHolderMain_dlFields_ctl00_txtSource" class="ms-input" />
    <select name="ctl00$PlaceHolderMain$dlFields$ctl00$ddlSourceFields" id="ctl00_PlaceHolderMain_dlFields_ctl00_ddlSourceFields" class="ms-input">
        <option value="Some Field Name 1">Some Field Name 1</option>
        <option value="Some Field Name 2">Some Field Name 2</option>
        <option value="Some Field Name 3">Some Field Name 3</option>
        <option value="Some Field Name 4">Some Field Name 4</option>
    </select>
    <a href="javascript: appendField();">append</a>
</td>

我似乎不知道如何捕获 sibling 。我试过$(this).siblings("input").val()但是报错了网页错误'parentNode.firstChild' is null or not an object .

尝试过$(this).prev().prev().val()返回时未定义。获取这些东西的最佳方式是什么？

谢谢， 大卫

Answer 1

您的问题源于您的方法。直接调用函数不会执行您所期望的操作，即使用一个代表 标记的 jquery 对象。您可以注册一个函数来响应 上的 click 事件，而不是直接调用函数。

首先，为您的链接提供一个 ID:

<a href="#" id="appendSelect">append</a>

然后使用响应 click 的 jQuery 选择替换您的 appendField() 函数

$(document).ready(function() {
  $("#appendSelect").click(function() {
    var $thatInput = $(this).siblings("input");
    var $selectValue = $(this).siblings("select").val();
    $thatInput.val($selectValue);
  })
});

通过这种方法，$(this) 将代表您的 。

您可以使用 JavaScript 调试控制台(Chrome 默认有一个，您可以在 Firefox 上使用 Firebug)更深入地了解我正在谈论的内容。再次尝试基于原始函数的方法并添加 console.log($(this)); 语句。您应该看到它打印出一个 DOMWindow 对象。现在，将相同的日志语句放入 click 函数中，您将看到 jQuery 为您提供了一个 $(this) 代表您期望的内容。