गतिशील रूप से jQuery का उपयोग करके onClick घटना को जोड़ना


128

प्लग इन का उपयोग किए जाने के कारण, मैं सामान्य रूप से HTML फॉर्म इनपुट में "ऑनक्लिक" विशेषता नहीं जोड़ सकता। एक प्लगइन मेरी साइट में रूपों भाग को संभाल रहा है और यह स्वचालित रूप से ऐसा करने का विकल्प नहीं देता है।

मूल रूप से मेरे पास यह इनपुट है:

<input type="text" id="bfCaptchaEntry" name="bfCaptchaEntry" style="">

मैं इसे इस तरह से होना करने के लिए jQuery onload के साथ एक onClick जोड़ना चाहते हैं:

<input onClick="myfunction()" type="text" id="bfCaptchaEntry" name="bfCaptchaEntry" style="">

मैं यह कार्य कैसे करूं?

मुझे पता है कि यह मानक अभ्यास नहीं हो सकता है लेकिन मेरी स्थिति में ऐसा करना सबसे आसान विकल्प लगता है।

मैं jQuery के लिए एक नौसिखिया हूँ तो किसी भी मदद की बहुत सराहना की है।

जवाबों:


211

आप clickईवेंट का उपयोग कर सकते हैं और अपने फ़ंक्शन को कॉल कर सकते हैं या अपने तर्क को हैंडलर में स्थानांतरित कर सकते हैं:

$("#bfCaptchaEntry").click(function(){ myFunction(); });

आप clickईवेंट का उपयोग कर सकते हैं और अपने फ़ंक्शन को हैंडलर के रूप में सेट कर सकते हैं :

$("#bfCaptchaEntry").click(myFunction);

.click ()

किसी ईवेंट हैंडलर को "इवेंट" पर क्लिक करें, या किसी ईवेंट पर उस ईवेंट को ट्रिगर करें।

http://api.jquery.com/click/


आप अपने फ़ंक्शन onको बाध्य करने "click"और अपने फ़ंक्शन को कॉल करने या अपने तर्क को हैंडलर में स्थानांतरित करने के लिए उपयोग कर सकते हैं :

$("#bfCaptchaEntry").on("click", function(){ myFunction(); });

आप उपयोग कर सकते हैं onघटना के लिए बाध्य "click"और हैंडलर के रूप में अपने कार्य को सेट करें:

$("#bfCaptchaEntry").on("click", myFunction);

।पर()

चयनित तत्वों में से एक या अधिक ईवेंट के लिए ईवेंट हैंडलर फ़ंक्शन संलग्न करें।

http://api.jquery.com/on/


सरल और समझने में आसान। बिल्कुल वही जो मैं चाहता था। एक और सवाल: jQuery का उपयोग करके पृष्ठभूमि के रंग परिवर्तन को एकीकृत करने का सबसे आसान तरीका क्या है? या 'style.backgroundColor = "white" का उपयोग करना बेहतर है? " फ़ंक्शन अनुभाग में?
क्लाउडियो डेलगाडो

39

यदि आप अपना ऑब्जेक्ट क्लाइंट नाम जानते हैं तो यह प्रयास करें (यह महत्वपूर्ण नहीं है कि यह बटन या टेक्स्टबॉक्स है)

$('#ButtonName').removeAttr('onclick');
$('#ButtonName').attr('onClick', 'FunctionName(this);');

यदि आप JQuery के साथ सर्वर ऑब्जेक्ट पर onClick ईवेंट जोड़ना चाहते हैं, तो इसे आज़माएं

$('#' + '<%= ButtonName.ClientID %>').removeAttr('onclick');
$('#' + '<%= ButtonName.ClientID %>').attr('onClick', 'FunctionName(this);');

यह एक ही समय में कॉल किए बिना, फ़ंक्शन सेट करता है।
वासिलिस

.Clr के बजाय .Clr का उपयोग करें। इसका मतलब यह भी है कि आप किसी फ़ंक्शन को कॉल करने के बजाय स्क्रिप्ट कमांड को सीधे असाइन कर सकते हैं, जैसे "history.go(0);"या "alert('Hi!');"
जोनाथन

2
यह वही है जो मुझे चाहिए था, जैसा कि मैं चाहता था कि दोनों एक अलग फ़ंक्शन को परिभाषित करें और इसे कॉल किए बिना फ़ंक्शन को सेट करने में सक्षम हों। 4 साल देर से धन्यवाद।
केविन वाकर

1
मैं इस जवाब के बारे में क्या प्यार करता हूं कि यह फ़ंक्शन को कॉल नहीं करता है, लेकिन केवल
gdrt

18

नीचे दृष्टिकोण की कोशिश करो,

$('#bfCaptchaEntry').on('click', myfunction);

या यदि jQuery पूर्ण आवश्यकता नहीं है, तो नीचे देखें,

document.getElementById('bfCaptchaEntry').onclick = myfunction;

हालांकि उपरोक्त विधि में कुछ कमियां हैं क्योंकि यह एक संपत्ति के रूप में ऑनक्लियर को हैंडलर के रूप में पंजीकृत होने के बजाय सेट करता है ...

इस पोस्ट को और पढ़ें https://stackoverflow.com/a/6348597/297641


जब आप 'हालांकि उपरोक्त विधि' कहते हैं, तो यह स्पष्ट नहीं है कि क्या आप केवल सादे जावास्क्रिप्ट विधि का उल्लेख कर रहे हैं .onclick, या उपयोग करने की तुलना में दोनों संस्करणों को एक के रूप में समूहित कर रहे हैं .click। मुझे पता है कि यह वास्तव में पूर्व है, जैसा .onकि हैंडलर को पंजीकृत करता है, लेकिन इसे सीखने के लिए कहीं और जांच करनी होगी। यह भविष्य के पाठकों के लिए अच्छा होगा यदि यह आपके उत्तर में अधिक स्पष्ट हो ...;)
एंटोनचैनिंग


1
let a = $("<a>bfCaptchaEntry</a>");
a.attr("onClick", "function(" + someParameter+ ")");

0

या आप इसे परिभाषित करने के लिए एक तीर फ़ंक्शन का उपयोग कर सकते हैं:

$(document).ready(() => {
  $('#bfCaptchaEntry').click(()=>{

  });
});

बेहतर ब्राउज़र समर्थन के लिए:

$(document).ready(function() {
  $('#bfCaptchaEntry').click(()=>{

  });
});

1
मैं यह नहीं देखता कि यह कुछ नया कैसे प्रदान करता है क्योंकि स्वीकृत उत्तर पहले से ही सुझाई गई .click()विधि है। तीर फ़ंक्शन या नियमित कार्यों का उपयोग करना है या नहीं, मेरी राय में, पूछे गए प्रश्न से संबंधित चर्चा नहीं है। और बेहतर ब्राउज़र समर्थन के लिए आपको संभवतः दोनों एरो फ़ंक्शंस को निकालना चाहिए, न केवल पहले वाले को।
अग्रम

क्योंकि jQuery का उपयोग करने का एक और तरीका है
गेब्रियल जैम सिएरा रुआ
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.