OnClick jQuery

49

इस लंगर क्लिक पर संभाल करने के लिए, की तुलना में आप सिर्फ

document.getElementById('anchorID').onclick=function(){/* some code */}

अन्यथा लिख सकते हैं केवल एक ही समारोह में शामिल होंगे, तो आप डोम विधि addEventListener

function clickHandler(){ /* some code */ } 
var anchor = document.getElementById('anchorID'); 
if(anchor.addEventListener) // DOM method 
    anchor.addEventListener('click', clickHandler, false); 
else if(anchor.attachEvent) // this is for IE, because it doesn't support addEventListener 
    anchor.attachEvent('onclick', function(){ return clickHandler.apply(anchor, [window.event]}); // this strange part for making the keyword 'this' indicate the clicked anchor

उपयोग करने के लिए भी कॉल करने के लिए याद है उपरोक्त कोड जब सभी तत्व लोड होते हैं (उदाहरण के लिए। window.onload पर)

-

संपादित करें

मुझे लगता है कि आपने कुछ विवरण जोड़े हैं। आप sth साथ नीचे

$("a.scroll-up, a.scroll-down").click(function(){SNavigate($(this).attr("href").substr(7));return false;});

कोड है कि jQuery का उपयोग नहीं करता बदलना चाहते हैं, तो यह html में बिना किसी अतिरिक्त कोड के साथ काम

function addEvent(obj, type, fn) { 
     if (obj.addEventListener) 
       obj.addEventListener(type, fn, false); 
     else if (obj.attachEvent) 
       obj.attachEvent('on' + type, function() { return fn.apply(obj, [window.event]);}); 
} 
addEvent(window, 'load', function(){ 
    for(var i=0, a=document.anchors, l=a.length; i<l;++i){ 
     if(a[i].className == 'scroll-up' || a[i].className == 'scroll-down'){ 
     addEvent(a[i], 'click', function(e){ SNavigate(this.href.substr(7)); e.returnValue=false; if(e.preventDefault)e.preventDefault();return false}); 
     } 
    } 
});

स्रोत

2009-05-12 20:52:20 Rafael

+1

goood, धन्यवाद। मुझे इसी की जरूरत थी। – Mike

+0

आपको डीन एडवर्ड्स समाधान दिलचस्प भी मिल सकता है - http://dean.edwards.name/weblog/2005/10/add-event/ –

+1

@Russ कैम: डीन एडवर्ड्स समाधान का एक नुकसान है, बाद में डीन ने क्या वर्णन किया: http://dean.edwards.name/weblog/ – Rafael

2

<script> 
function tramtramtram(){ 
    alert("tram it!"); 
} 
</script> 


<a href="#" onclick="tramtramtram()">tramtram</a>

स्रोत

2009-05-12 20:48:25 bchhun

+0

मैं नहीं बता सकता है जो हम में से एक यहां मिला पहला ;-) – Kredns

+0

मुझे HTML – Mike

+0

से सभी "ऑनक्लिक" को हटाने की आवश्यकता है, तो कैनवर का जवाब अच्छा है। – bchhun

11

कैसे इस बारे में:

document.getElementById("lady").onclick = function() {alert('onclick');};

स्रोत

2009-05-12 20:48:56 Canavar

+0

अच्छा लग रहा है। क्या आप jquery का उपयोग किये बिना सामान्य जेएस के साथ दिए गए फ़ंक्शन को प्रतिस्थापित कर सकते हैं? – Mike

+0

बस ऑनलिक संपत्ति को ओवरराइट करें। यदि आप addEventListener का उपयोग कर रहे थे, तो आपको बाद में इसे हटाने के लिए जो भी जोड़ा गया है उसका ट्रैक रखना होगा (जो कि JQuery स्वयं का उपयोग करता है)। – Anonymous

+0

@ माइक: जो "सामान्य" जावास्क्रिप्ट है। इसके अलावा यह आपके कोड की तरह कक्षा के बजाय आईडी द्वारा तत्व प्राप्त करता है। – bchhun

0

बस onclick विशेषता का उपयोग।

<a href="#" onclick="functionName(someParam)">

या जावास्क्रिप्ट से यह करने के लिए,

document.getElementById("anchorID").onclick = function(){ 
    some code 
};

स्रोत

2009-05-12 20:49:49 null

+0

मुझे HTML – Mike

+0

से सभी "ऑनक्लिक" को हटाने की आवश्यकता है क्योंकि नया प्रश्न किसी आईडी के बजाय क्लास चयनकर्ता का उपयोग करता है, इसलिए आपको पहले उस वर्ग का उपयोग करके सभी तत्वों को ढूंढना होगा। google में getElementsByClass के कई कार्यान्वयन देखें। – null

1

वर एल = document.getElementById ('महिला'); el.addEventListener ("क्लिक करें", tramtramtram, झूठा);

स्रोत

2009-05-12 20:51:12 ka3751

0

आपको ऑनक्लिक हैंडलर जोड़ने के लिए getElementById का उपयोग करने की आवश्यकता है। हालांकि आपको कहीं अपना कोड शुरू करने की आवश्यकता है। JQuery के बिना आप केवल बॉडी ऑनलोड हैंडलर का उपयोग कर सकते हैं:

<body onload="myinitfunction()">

myinitfunction बाहरी जेएस फ़ाइल में हो सकता है।

स्रोत

2009-05-12 20:52:08 kgiannakakis

+0

अधिभार - अपशिष्ट, है ना? – Mike

2

करना चाहिए, यहाँ यह करने के लिए एक रास्ता है :

<html><body><head><script> // This script could be in an external JS file 
function my_handler(elt) { 
    alert("Yay!"); 
    return false; 
} 

function setup() { 
    document.getElementById('lady').onclick = my_handler; 
} 

window.onload = setup; 
</script></head> 
<body><a href='#' id='lady'>Test</a></body> 
</html>

स्रोत

2009-05-12 20:52:27 RichieHindle

+0

क्या आप jquery का उपयोग किए बिना किसी दिए गए फ़ंक्शन को सामान्य जेएस के साथ प्रतिस्थापित कर सकते हैं? – Mike

+0

वह * सामान्य जावास्क्रिप्ट है, jQuery का उपयोग किए बिना। – RichieHindle

+0

प्रश्न – Mike

5

W3C पता चलता है:

element.addEventListener('click',doSomething,false)

माइक्रोसॉफ्ट का उपयोग करता है:

element.attachEvent('onclick',doSomething)

आप कुछ फीचर पहचान कर सकते हैं और निर्धारित कर सकते हैं कि कौन सी कॉल का उपयोग करना है।

http://www.quirksmode.org/js/events_advanced.html से।

स्रोत

2009-05-12 20:52:44

+0

में एक नया कोड है तो क्या आप बाद में ईवेंट को हटा सकते हैं? क्या होगा यदि यह एक नामहीन घटना थी, जैसे फ़ंक्शन घोषणा यानी। foo.addEventListener ('ऑनक्लिक', फ़ंक्शन() {अलर्ट ('बार')); या यह हमेशा के लिए जुड़ा हुआ है? –

+0

(मैं सिर्फ उत्सुक हूं, बीटीडब्ल्यू, मुझे इस कोड की कोई आवश्यकता नहीं है ... बस इस पोस्ट को पढ़ रहा था और सवाल मेरे लिए हुआ)। –

+0

आप element.removeEventListener (WC3) या element.detachEvent (MS) के माध्यम से ईवेंट को हटा दें। दुर्भाग्यवश, यह अज्ञात कार्यों के लिए काम नहीं करता है। मैं इवेंट हैंडलर के लिए नामित कार्यों के साथ रहूंगा। –

1

इस स्क्रिप्ट जब दस्तावेज़ भार (अपना सामान के साथ चेतावनी की जगह) निष्पादित करें:

var rgLinks = document.getElementsByTagName("A"); 

for (var x=0; x<rgLinks.length; x++) { 
    el = rgLinks[x]; 

    if (el.className == 'scroll-down' || el.className == 'scroll-down') 
     { 
     el.onclick = function() {alert('onclick');}; 
     } 
    }

हो सकता है कि तुम क्या बारे में पूछ रहे है ...

स्रोत

2009-05-12 21:20:29

OnClick jQuery

उत्तर

संबंधित मुद्दे