如何用jQuery获取点击元素最近的输入值?


如需用jQuery获取点击元素最近的输入值,请按照下列步骤操作:

  • 你需要用closest找到匹配给定值的最近祖先元素。
  • 现在,用属性等于选择器,找到具有指定名称的输入。
  • 最后一步是用val()方法来检索输入值。

我们先看看如何添加jQuery:

示例

你可以尝试运行下列代码用jQuery从点击元素中获取最近的输入值:

在线演示

<!DOCTYPE html>
<html>
   <head>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
      <script>
         $(document).ready(function(){
             $(".add").on("click", function () {
                var v = $(this).closest("div.content").find("input[name=’rank’]").val();
                alert(v);
             });
         });
      </script>
   </head>
<body>
  <div class="content">
     <div class="ranking">
        <label>Rank:</label>
        <input type="text" name="rank" value="1"/>
     </div>
     <div class="buttons">
        <a href="#" class="add">Click</a>
     </div>
  </div>  
</body>
</html>

更新于:2020-02-14

8K+ 浏览

开启你的职业生涯

完成学习并获得认证

立即开始
广告