क्या मेरे पास एक तत्व में दो jquery onclick घटनाएं हो सकती हैं?

Question

मुझे पता है कि इससे पहले पूछा गया है लेकिन मुझे अपने विशेष कार्यों को एक क्लिक पर भी जोड़ने का वाक्यविन्यास नहीं मिल सकता है।

वर्तमान onclick कोड:

<a class="thumbLinkCart" href="#" onclick="simpleCart.add('name=lemon','price=7.99','image=images/thumbs/yellowgold.jpg');return false;"></a> 

दूसरा घटना जोड़े जाने के लिए:

<script> 
    $(document).ready(function() { 
     $('#demo12').click(function() { 
    $.growlUI('Item added to cart'); 
}); 
}); 
</script> 

कोई मुझे पहले onclick घटना के बाद दूसरे समारोह जोड़ने में मदद कर सकते हैं कृपया।

Answer 1

आपके पास एक ही तत्व से जुड़ी कई घटनाएं (समान) हो सकती हैं। लेकिन यदि आप इनलाइन ईवेंट हैंडलर का उपयोग करके ईवेंट को बाध्य करते हैं, तो आप एक ईवेंट को परिभाषित कर सकते हैं।

नोट: हमेशा एक बेहतर विचार जावास्क्रिप्ट का उपयोग करने की घटनाओं बाध्य करने के लिए है, क्योंकि यह चिंताओं में से और रख-रखाव के प्रयोजनों के लिए जुदाई बनाए रखता है।

आप के बजाय अपने जे एस कोड है जो बहुत क्लीनर

है jQuery में तत्वों के लिए कई घटनाओं बाध्य कर सकते हैं

$('#demo12').on('click', function() { 
    alert('1st click event'); 
    // Add items to the cart here 
}); 

$('#demo12').on('click', function() { 
    alert('2nd click event'); 
    // Do something else 
}); 

वेनिला जावास्क्रिप्ट

document.querySelector('#demo12').addEventListener('click', function() { 
    alert('1st click event'); 
    // Add items to the cart here 
}); 

document.querySelector('#demo12').addEventListener('click', function() { 
    alert('2nd click event'); 
    // Do something else 
}); 

Check Fiddle

Answer 2

"वापसी झूठ;" को प्रतिस्थापित करने का प्रयास करें "event.preventDefault();" के साथ। इससे घटना को प्रसारित करने देना चाहिए ताकि क्लिक हैंडलर ट्रिगर्स हो, लेकिन फिर भी नेविगेटिंग से ए-href को रोक दें।

Answer 3

इसे आमतौर पर onclick विशेषता का उपयोग करने के लिए बुरी आदत माना जाता है। यह व्यवहार (जावास्क्रिप्ट) के साथ बहुत अधिक संरचना (एचटीएमएल) mingles।

यह सब एक साथ क्यों नहीं करते?

<a class="thumbLinkCart" href="#">Link</a> 

और

<script> 
    $(document).ready(function() { 
    $('.thumbLinkCart').click(function() { 
     simpleCart.add('name=lemon','price=7.99','image=images/thumbs/yellowgold.jpg'); 
     $.growlUI('Item added to cart'); 
    }); 
    }); 
</script>