带有额外选择器的 jQuery DOM 节点答案

【问题标题】：jQuery DOM node with additional selectors带有额外选择器的 jQuery DOM 节点
【发布时间】：2010-10-16 00:21:16
【问题描述】：

在 jQuery 中传入一个 DOM 节点后，我正在尝试进行其他选择。在此示例中，我试图在选择框发生更改后显示“隐藏”提交按钮（注意，我传入的是 FORM 元素，而不是 SELECT 元素：

<form id="UpdateRegistrationStatusForm">
   <select id="registration_status" onchange="AdjustRegistrationStatus(this.form)">
         <option value="1">approved</option>
         <option value="2">cancelled</option>
   </select>
   <input id="registration_status_update" type="submit" style="display:none" value="update"/>
</form>

所以，我想做但不起作用的 jQuery 代码看起来像这样......

function AdjustRegistrationStatus(myForm)
{
     jQuery(myForm "#registration_status_update").show();
     if (jQuery(myForm "#registration_status").val() == 1)
     {
          //do some other things here...
     }
}

我想从一个 FORM DOM 对象开始，然后添加额外的“字符串”选择器。有什么帮助吗？

【问题讨论】：

标签： jquery jquery-selectors

【解决方案1】：

我怀疑您正在寻找 find 函数，但我有点困惑，因为从属元素具有 ID，因此您实际上不需要从表单开始。如果他们有其他一些非独特的东西（比如类），你可以这样做：

var form = $('#UpdateRegistrationStatusForm');
form.find('.regupdate').show();
if (form.find('.regstatus').val() == 1)
{
    //...
}

..但使用 ID 没有太多理由。

【讨论】：

【解决方案2】：

为此，请使用#id selector（id 应该是唯一的，与它的关系无关）：

jQuery("#registration_status_update").show();

在其他情况，像这样使用.find()：

jQuery("#registration_status_update").show();

.find() 查找与选择器匹配的所有后代，it's one of many tree traversal functions 用于移动。

【讨论】：