ऑनक्लिक ईवेंट में एकाधिक जावास्क्रिप्ट फ़ंक्शंस को कैसे कॉल करें?

Question

क्या एक से अधिक जावास्क्रिप्ट फ़ंक्शन को कॉल करने के लिए onclick HTML विशेषता का उपयोग करने का कोई तरीका है?

Answer 1

onclick="doSomething();doSomethingElse();" 

लेकिन वास्तव में, आप बिल्कुल नहीं onclick उपयोग कर और अपने जावास्क्रिप्ट कोड के माध्यम से डोम नोड के लिए ईवेंट हैंडलर संलग्न से बेहतर कर रहे हैं। इसे unobtrusive javascript के रूप में जाना जाता है।

Answer 2

निश्चित रूप से, बस इसे कई श्रोताओं को बांधें।

Short cutting with jQuery

$("#id").bind("click", function() { 
 
    alert("Event 1"); 
 
}); 
 
$(".foo").bind("click", function() { 
 
    alert("Foo class"); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="foo" id="id">Click</div>

Answer 3

1 समारोह के साथ एक लिंक someFunc()

function someFunc() { 
    showAlert(); 
    validate(); 
    anotherFunction(); 
    YetAnotherFunction(); 
} 

Answer 4

से

<a href="#" onclick="someFunc()">Click me To fire some functions</a> 

अनेक कार्यों का फायरिंग परिभाषित मैं एक समारोह को लिंक करने का element.addEventListener विधि का प्रयोग करेंगे। उस फ़ंक्शन से आप कई फ़ंक्शन कॉल कर सकते हैं।

लाभ जो मैं एक समारोह में किसी ईवेंट को बाध्य करने में देखता हूं और फिर कई कार्यों को बुलाता हूं यह है कि आप कुछ त्रुटि जांच कर सकते हैं, कुछ और बयान दें ताकि कुछ कार्य केवल तभी प्राप्त किए जाएं जब कुछ मानदंड पूरा हो जाएं।

Answer 5

यह अगर आप केवल जावास्क्रिप्ट और नहीं jQuery का उपयोग कर रहे कोड की आवश्यकता है

var el = document.getElementById("id"); 
el.addEventListener("click", function(){alert("click1 triggered")}, false); 
el.addEventListener("click", function(){alert("click2 triggered")}, false); 

Answer 6

आप एक में सभी कार्यों की रचना और them.Libraries फोन Ramdajs की तरह एक में अनेक कार्यों का रचना के लिए एक समारोह है सकते हैं ।

<a href="#" onclick="R.compose(fn1,fn2,fn3)()">Click me To fire some functions</a> 

या आप js फ़ाइल में एक अलग समारोह के रूप में रचना डाल दिया और फोन यह

const newFunction = R.compose(fn1,fn2,fn3); 


<a href="#" onclick="newFunction()">Click me To fire some functions</a> 

Answer 7

आप एक से अधिक केवल कोड से भले ही आप दूसरे onclick गुण है एचटीएमएल यह हो जाता है में जोड़ सकते हैं कर सकते हैं अनदेखा किया गया, और click2 triggered मुद्रित नहीं होता है, आप mousedown पर कार्रवाई को जोड़ सकते हैं लेकिन यह केवल एक कामकाज है।

var element = document.getElementById("multiple_onclicks"); 
 
element.addEventListener("click", function(){console.log("click3 triggered")}, false); 
 
element.addEventListener("click", function(){console.log("click4 triggered")}, false);

<button id="multiple_onclicks" onclick='console.log("click1 triggered");' onclick='console.log("click2 triggered");' onmousedown='console.log("click mousedown triggered");' > Click me</button>

आप के रूप में की घटनाओं अप पाइल कर सकते हैं देखभाल करने के लिए की जरूरत है, और यदि आप कई घटनाओं आप जोड़ना होगा:

तो सबसे अच्छा करने के लिए उन में के रूप में कोड से जोड़ने है वे दौड़ने के आदेश की गिनती खो सकते हैं।