使用最接近的表单对象-解网

问：

最近，我正在审查另一位程序员编写的客户端代码。我对用于获取表单对象的代码感到惊讶。

用于登录表单的 HTML

<form id="frm_login" action="">
  <input type="text" name="username" id="username">
  <input type="password" name="pwd" id="pwd">
</form>

他使用以下代码来获取表单对象

$frm = $("input[type='password']").closest("form");

但是有简单的代码可以获取我更喜欢的表单对象：

$frm = $("#frm_login");

在上述场景中，是否有任何理由使用最接近的获取表单对象？

我真的很想知道是否有任何性能问题。

JavaScript jQuery 性能 DOM 客户端

<form id="frm_login1" action="">
    <input type="text" name="username" id="username1" />
    <input type="password" name="pwd" id="pwd1">
    <table>
        <tr>
            <td>
                <input type="text" class="myInputClass" />
            </td>
        </tr>
    </table>
</form>
<form id="frm_login2" action="">
    <input type="text" name="username" id="username2">
    <input type="password" name="pwd" id="pwd2">
    <table>
        <tr>
            <td>
                <input type="text" class="myInputClass" />
            </td>
        </tr>
    </table>
</form>

Java脚本

$("input[type='password']").closest("form").each(function(){
   alert($(this).find('.myInputClass').val()); 
});

但是，在某些情况下，您需要使用最接近的来获取表单，例如，如果您编写一个通用函数来验证每个表单中的每个密码输入，在这种情况下，您不喜欢通过 ID 获取表单并搜索其子密码字段以防止自动提交，所以我猜是写代码的人，正在这样做（在提交前验证密码的功能）

$("input[type='password']").each(function(){
   $frm = .closest("form");
   $frm.submit(function(event){
       if( not valid password){
          ......
          return false;
       }
   });

});

0赞 Govinda Rajbhar 1/30/2014 #3

如果页面上有单个表单，则无需使用 nearest 将其与其父表单相关联。如果表单没有 id，那会更有意义。通过 id 获取表单似乎更直接、更快速。

但是该方法非常酷且非常有用，尤其是当您开始处理事件委派时，其中事件被困在节点树中的级别高于触发事件的元素。Closest()

该方法在 DOM 树中搜索这些元素及其祖先，并从匹配的元素构造一个新的 jQuery 对象。closest()

使用最接近的表单对象

Using closest for getting form object

评论

评论

评论