jquery if語句，用於檢查元素是否在特定父div中

Question

我的布局中有很多帶有.button類的元素。 單擊帶有按鈕類的元素后，我需要首先檢查元素是否在box1或box2的父div中。

一個簡短的例子是......如果點擊的按鈕在box1 div &&（另一個條件）內，那么就做點什么。 是否最好使用.closet和.length的組合來檢查按鈕是否在某個div內？

<div id="box1">
        <div id="column1">
             <div class="round_button"></div>
             <div style="background: #000">
                  <div class="button"></div>
                  <div class="button"></div>
                  <div class="button"></div>
                  <div class="button"></div>
                  <div class="button"></div>
                  <div class="button"></div>
             </div>
        </div>
 <div> 

<div id="box2">
        <div id="column2">
             <div class="round_button"></div>
             <div style="background: #000">
                  <div class="button"></div>
                  <div class="button"></div>
                  <div class="button"></div>
                  <div class="button"></div>
                  <div class="button"></div>
                  <div class="button"></div>
             </div>
        </div>
 <div> 

Answer 1

除了上面的答案，如果有多個按鈕，而不是分別將事件綁定到每個按鈕，您只需要附加一次，基於其祖先，您可以執行以下操作：

$(".button").click(function() {
  if ($(this).is("#box1 *")) {}
});

Answer 2

如果兩組按鈕之間的功能差別很大，我只想在每組按鈕上定義事件處理程序：

$('#box1 .button').on('click', function(event) {
  // ...
});

$('#box2 .button').on('click', function(event) {
  // ...
});

Answer 3

如果沒有別的，你不需要if statement 。

$('#box1, #box2').find('.button').click(function() {
  //  do something
});

Answer 4

使用$(this).parents("#box1"); 在按鈕的單擊事件功能內

Answer 5

$('#box1 .button').click(function() {
  // first code
});

$('#box2 .button').click(function() {
  // second code
});