javascript - 如何在 jQuery 中定义选择一个元素？

Question

这是我的代码:

$(".add_more_file").on("click", function(){
  var $input = $(this).siblings('input').clone();
  $input.insertBefore($(this));
})

a, input{
  display: block;
  margin-bottom: 5px;
}
a{
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="w_activity_licenses_inputs">
    <input  class="upload"  type="file" name="activity_licenses" required />
    <a class="add_more_file" style="display:block">Add more file</a>
</div>

当我点击那个按钮两次时，我将有 4 个输入。虽然我想有 2 个输入。我知道，这是因为第二次，两个元素将在 siblings 函数中匹配。有什么想法吗？

Answer 1

您可以使用 .first() 函数来获取第一个兄弟元素。

    $(".add_more_file").on("click", function(){
      var $input = $(this).siblings('input').first().clone();
          $input.insertBefore($(this));
    })

a, input{
  display: block;
  margin-bottom: 5px;
}
a{
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="w_activity_licenses_inputs">
    <input  class="upload"  type="file" name="activity_licenses" required />
    <a class="add_more_file" style="display:block">Add more file</a>
</div>