在同时使用所有这3个事件时,我似乎遇到了问题。
我有一个大的div,它有mouseup,mousedown和mousemove绑定到它。在这个大型div中,有几个较小的div(我想点击它)。我应该补充一点,clickable
元素是较大div的子元素。
问题是click
事件似乎不起作用。但是,如果我注释掉其他鼠标事件,它可以正常工作。
我猜这里存在某种事件冲突,因为点击实际上是mousedown和mouseup的组合。
<script type="text/javascript">
$(document).ready(function() {
//Create tooptips for existing zones
$('.oldBox').tipsy({
title: 'data-callrange',
gravity: 'sw'
});
var x1,y1;
$('.openTab .img_container').live('mousedown', function(e) {
e.preventDefault();
});
$('.openTab .img_container').live('mousemove', function(e) {
});
//Process just created box
$(document).mouseup(function() {
});
$('.oldBox').live('click', function(){
$('#mouse_pos').html('You clicked '+ $(this).attr('data-callrange'));
});
});
</script>
答案 0 :(得分:2)
在父div
上的事件中,您可以检查以确保单击的元素(事件目标)实际上是父div,而不是子div。请参阅this fiddle作为示例。
在父div
的事件处理程序中,使用类似:
if(event.target.id == "i_am_a_big_div_with_three_events") {
//Do stuff
}
并将您的点击事件正常附加到孩子div
。