Question

我有一个嵌套了多个元素的div。如果按下div，则按钮出现在同一个DIV中。如果我按下按钮，按钮也会消失（这是因为div上的toggleClass）

我已经尝试过回来了，但那也不行。请参阅下面的JSFiddle

＆＃13;

$(document).on('click', "[data-link=level1]", function() {
  console.log("li clicked");

  $(this).find(".knoppenbalk").toggleClass("displaynone");

});

$(document).on('click', "[data-link=solo]", function() {
  console.log("solo BUTTON clicked");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div data-link="level1" class="limodeknop">
  <div class="overlay"></div>
  <div class="modeknop">
    <div class="titel">
      <lrmodenaam>Level 1</lrmodenaam>
      <lrsubmode>Tutorial</lrsubmode>
    </div>
    <div class="knoppenbalk displaynone">
      <div data-link="solo" class="solo btn">Solo</div>
    </div>
  </div>
</div>

＆＃13;

这是用jQuery制作的，我和Framework7一起工作，但我不认为这是一个问题。

Answer 1

您应该停止事件的传播（调用冒泡）。你可以搜索大量关于它的文章。

http://jsfiddle.net/p168uLv2/1/

$(document).on('click',"[data-link=solo]", function(e){
    console.log("solo BUTTON clicked");
    e.stopPropagation();
});

这仅适用于子元素，以避免父点击传播。

Answer 2

您可以使用以下命令停止传播到父元素的事件：

YBO_CRNCY

您需要接受EUR作为内联函数的参数。

Answer 3

$(document).on('click',"[data-link=solo]", function(e){
    e.stopImmediatePropagation();
    console.log("solo BUTTON clicked");
})

元素上的元素被Javascript点击

3 个答案: