防止在單擊內部div時觸發單擊處理程序

Question

我相信我的問題與以下問題相反： 阻止執行父事件處理程序

我正在Google Apps腳本中構建UI。 我在較大的容器div中有一個選擇框。 我希望能夠在單擊父div時使用jQuery運行動畫，但是我不希望在單擊選擇框時運行動畫。 我嘗試使用stopPropagation，但這無濟於事。 當前，動畫是在div本身或單擊選擇下拉菜單時運行的：

  var ISDOWN = true;  //global to track whether div is down or up

  $("#outer-container").click(
  function(e) {
    e.stopPropagation();
    var source = $(this).attr('id');
    if (source === "outer-container"){
      if (ISDOWN === true){
        $("#outer-container").animate({top: "8px"});
          ISDOWN = false;
      }
      else {
        $("#outer-container").animate({top: "45px"});
          ISDOWN = true;
      }
    }
  });

Answer 1

您可以檢查從事件對象的target屬性中單擊的元素

if ($(e.target).attr('id') === 'outer-container') {
  if (ISDOWN === true){
    $("#outer-container").animate({top: "8px"});
      ISDOWN = false;
  }
  else {
    $("#outer-container").animate({top: "45px"});
      ISDOWN = true;
  }
}