最接近jQuery无法正常工作

Question

当用户点击.dropzone元素时，我尝试通过jQuery点击.dropzone-upload-btn类。我有这个代码，但它没有做任何事情。知道为什么吗？

<div class="dropzone-wrapper">
  <div class="dropzone"></div>
  <div class="dropzone-upload-btn"></div>
</div>

这是jQuery代码（简化）

$('.dropzone-upload-btn').on("click", function() {
  return $(this).closest('.dropzone').click();
});

Answer 1

closest查看匹配的元素及其祖先。您可能需要siblings：

$('.dropzone-upload-btn').on("click", function() {
    return $(this).siblings('.dropzone').click();
});

参考文献：

• http://api.jquery.com/closest/
• http://api.jquery.com/siblings/

当然，如果您100％确定.dropzone元素将紧接在.dropzone-upload-btn元素之前，那么您可以使用prev或prevAll：

$('.dropzone-upload-btn').on("click", function() {
    return $(this).prev('.dropzone').click();
});

参考文献：

• http://api.jquery.com/prev/
• http://api.jquery.com/prevAll/

如果您知道目标元素将位于匹配的元素之前，则可以使用

prevAll，但之前不一定 。 prev只会查看第一个 立即上一个兄弟。

prevAll和siblings之间的区别在于siblings在匹配元素之后的和之前查看兄弟姐妹，而prevAll仅查看在它之前的兄弟姐妹。