[英]JQuery bind click event on div
I have some html like this: 我有一些像这样的HTML:
<div class="vmail vmail-bar normal-vmail-bar" id="pm_<?php echo $pm->to_id; ?>">
<div class="checkbox"><input type="checkbox" class="checkbox" /></div>
<div class="vmail-from">
<?php echo $pm->Prenume." ".$pm->Nume; ?>
</div>
<div class="vmail-content-title"><?php echo $pm->subject; ?> </div>
</div>
and the following Jquery: 和以下Jquery:
// Read message - bind click on entire div ( the div includes the checkbox)
container.find('.vmail').bind('click', function() {
var id = $(this).attr('id').replace("pm_","");
getPM(id);
});
// bind click on checkbox
container.find(':checkbox').bind('click', function() {
if($(this).is(':checked')) {
...
} else {
...
}
});
both methods are tested and they worked, but after I did the bind on entire div (.vmail) , when I click on the input checkbox the event bined to the checkbox does not work and the event for the div is fired instead. 两种方法都经过测试并且有效,但是在我对整个div(.vmail)进行绑定之后,当我点击输入复选框时,复选框中的事件不起作用,而是触发了div的事件。
I want the event responsible for the checkbox click to fire and the div click to be canceled if I press click on the checkbox. 我希望负责复选框的事件单击以触发,如果我按下复选框,则单击要取消div。
You might want to look at the stopPropagation
method on events. 您可能希望查看事件的
stopPropagation
方法。 This will prevent it from 'bubbling' to parent elements. 这将阻止它“冒泡”到父元素。
container.find(':checkbox').bind('click', function(ev) {
ev.stopPropagation();
if($(this).is(':checked')) {
...
} else {
...
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.