`mousedown`事件期間添加新元素防止觸發`click`事件？

我正在使用jquery事件，並且我在mousedown時候在鼠標指針的位置添加了一個新元素，並且在添加元素之後綁定的click事件沒有被觸發。`mousedown`事件期間添加新元素防止觸發`click`事件？

任何建議是可觀的。

在此先感謝。

馬杜

代碼：

<div style="border:1px solid">Click</div> 
<span></span> 
<div class="vis" style="display:none">Hello</div> 
<script> 
    var visualEle = $('div.vis'); 
    visualEle.css({border:"1px solid"}); 
    $('a').on("click", function (e) { e.preventDefault();}); 
    $('div').on("mousedown", mDown); 
    $('div').on("mouseup",mUp); 
    function mDown(e) { 
     e.preventDefault(); 
     visualEle.css({ left: 100, top: 0, display: "block" }); 
     } 

    function mUp(e) { 

     e.preventDefault(); 
     $('span').append('mouse up triggerd<br/>'); 
     return false; 
    } 
    $('p').on("click",dClick); 
    function dClick(e) {     
      $('span').append('double click triggerd<br/>'); 

    } 
</script>

在上面的代碼中mousedown完成後，則不會觸發事件click。根據this文件

的click事件被髮送到一個元件，當鼠標指針在元件和鼠標按鈕被按下並在你的情況鼠標點釋放

來源

2014-02-20 Madhu

的原因是爲了點擊觸發事件，你需要有鼠標向下和向上的相同情況發生元素，但由於您要將div元素移動到鼠標座標，mouseup事件將觸發div元素，因此單擊事件不會被觸發... –

如果可能，請使用'mouseup'事件 - http：// jsfiddle .net/arunpjohny/2WcYB/6/ –

當mousedown發生時結束，但在此之後visualDiv移動並且在此元素上釋放鼠標。

可能的解決方案，我能想到由於@ArunPJohny的是使用$(this).trigger("click");

$('p').on("mousedown", function (e) { 
    _x = e.pageX; 
    _y = e.pageY; 
    visualDiv.css({ 
     left: _x, 
     top: _y 
    }); 
    $(this).trigger("click"); 
}); 
$('p').on("click", function (e) { 
    console.log(e.target) 
});

演示：http://jsfiddle.net/c5CRd/

來源

2014-02-20 11:11:21 Yogesh

感謝您的更新，但我sti我沒有明白。 – Madhu

你不明白的是什麼？ – Yogesh

`mousedown`事件期間添加新元素防止觸發`click`事件？

回答

相關問題