मेरे पास एक चेकबॉक्स है जिसे मैं क्लिक इवेंट पर कुछ अजाक्स कार्रवाई करना चाहता हूं, हालांकि चेकबॉक्स एक कंटेनर के अंदर भी होता है, जिसमें यह स्वयं क्लिक व्यवहार होता है कि मैं चेकबॉक्स को क्लिक करने पर चलाना नहीं चाहता। यह नमूना दिखाता है कि मैं क्या करना चाहता हूं:
$(document).ready(function() {
$('#container').addClass('hidden');
$('#header').click(function() {
if ($('#container').hasClass('hidden')) {
$('#container').removeClass('hidden');
} else {
$('#container').addClass('hidden');
}
});
$('#header input[type=checkbox]').click(function(event) {
// Do something
});
});#container.hidden #body {
display: none;
}<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<div id="container">
<div id="header">
<h1>Title</h1>
<input type="checkbox" name="test" />
</div>
<div id="body">
<p>Some content</p>
</div>
</div>हालाँकि, मैं यह नहीं पता लगा सकता कि डिफ़ॉल्ट क्लिक व्यवहार (चेकबॉक्स चेक / अनचेक किया गया) को न चलाने के कारण ईवेंट बबलिंग को कैसे रोकें।
निम्नलिखित दोनों ही घटना को बुदबुदाते हुए रोकते हैं लेकिन चेकबॉक्स स्थिति को नहीं बदलते हैं:
event.preventDefault();
return false;
2
मुझे इस मामले पर एक लेख मिला जो अन्य स्टैक ओवरफ्लॉवर के लिए सहायक हो सकता है। क्विक टिप: एक चेकबॉक्स पर क्लिक करने के लिए ट्रिगर से टेबल रो पर क्लिक करें
—
पेडर राइस