当孩子的mousedown事件被触发时,如何停止父母的点击事件

时间:2016-07-22 02:37:57

标签: javascript jquery

如标题所述,我想在孩子的mousedown事件被触发时停止父母的点击事件。

我的HTML代码如下所示

idSalesOrder

我的jquery代码看起来像这样

<div class='parent'> 
       <div class='child'></div>
</div>

2 个答案:

答案 0 :(得分:3)

鼠标事件就像这样触发

  1. 的MouseDown

  2. 点击

  3. 的MouseUp

  4. mousedown处理程序中的

    event.stopPropagation()仅影响mousedown事件。您可以尝试以下解决方法:

    &#13;
    &#13;
    var mdFaired = false;
    
    $('.parent').click(function(e) {
      if(!mdFaired) {
          var counter = $(this).children('.counter');
          var count = parseInt(counter.text());
          counter.text(++count);
      }
      else {
        mdFaired = false;
      }
    });
    
    $('.child').mousedown(function(e) {
      e.stopPropagation();
      mdFaired = true;
      
      var counter = $(this).children('.counter');
      var count = parseInt(counter.text());
      counter.text(++count);
    });
    &#13;
    div {
      border: 1px solid black;
      padding: 5px;
    }
    
    .parent {
      width: 300px;
      height: 300px;
    }
    
    .child {
      width: 50%;
      height: 50%;
      margin: 50px auto;
    }
    &#13;
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    
    <div class='parent'>
      <span class="counter">0</span>
      <div class='child'>
        <span class="counter">0</span>
      </div>
    </div>
    &#13;
    &#13;
    &#13;

答案 1 :(得分:2)

e.stopPropagation();
e.preventDefault();
  

e是从函数调用传递的事件。

应该做的伎俩。