हाइपरलिंक पर जावास्क्रिप्ट फ़ंक्शन पर क्लिक करें

Question

मैं एएसपी.NET की फ़ाइल के पीछे सी # कोड में गतिशील रूप से हाइपरलिंक बना रहा हूं। मुझे क्लाइंट क्लिक पर एक जावास्क्रिप्ट फ़ंक्शन कॉल करने की आवश्यकता है। मैं इसे कैसे पूर्ण करूं?

Answer 1

Neater अभी भी, मुझे लगता है कि ज़्यादा से ज़्यादा समझ में आता है:

var el = document.getElementById('foo'); 
el.onclick = showFoo; 


function showFoo() { 
    alert('I am foo!'); 
    return false; 
} 

<a href="no-javascript.html" title="Get some foo!" id="foo">Show me some foo</a> 

यदि जावास्क्रिप्ट विफल रहता है, तो कुछ प्रतिक्रिया होती है। इसके अलावा, अनियमित व्यवहार (href="#" के मामले में पृष्ठ कूदना, href="" के मामले में उसी पृष्ठ पर जाकर) समाप्त हो गया है।

Answer 2

onclick पैरामीटर के साथ

...

<a href='http://www.google.com' onclick='myJavaScriptFunction();'>mylink</a> 

Answer 3

onclick HTML attribute का प्रयोग करें।

onclick ईवेंट हैंडलर तत्व पर उपयोगकर्ताओं के माउस बटन से एक क्लिक करें घटना के लिए जो onclick विशेषता लागू किया जाता है कैप्चर करता है। यह कार्रवाई आमतौर पर typical href="#" या href="javascript:void" या href="whatever" के बजाय, एक जावास्क्रिप्ट समारोह के रूप में एक स्क्रिप्ट विधि इस तरह के लिए एक कॉल में परिणाम [...]

Answer 4

आदर्श रूप से मैं आपके अंदर कोड में लिंक उत्पन्न करने से बचूंगा क्योंकि हर बार जब आप उन प्रत्येक लिंक के 'मार्कअप' में बदलाव करना चाहते हैं तो आपके कोड को फिर से सम्मिलित करने की आवश्यकता होगी। यदि आपको ऐसा करना है तो मैं आपके एचटीएमएल के अंदर अपनी जावास्क्रिप्ट 'कॉल' एम्बेड नहीं करूंगा, यह एक खराब अभ्यास है, आपके मार्कअप को आपके दस्तावेज़ का वर्णन नहीं करना चाहिए, यह आपके जावास्क्रिप्ट का काम है।

एक दृष्टिकोण (या वर्ग अपनी आम कार्यक्षमता अगर) जहां प्रत्येक तत्व के लिए एक विशिष्ट आईडी का उपयोग करें और फिर ईवेंट हैंडलर (s), कुछ की तरह जोड़ने के लिए प्रगतिशील वृद्धि का उपयोग करें:

[c# example only probably not the way you're writing out your js] 
Response.Write("<a href=\"/link/for/javascriptDisabled/Browsers.aspx\" id=\"uxAncMyLink\">My Link</a>"); 

[Javascript] 
document.getElementById('uxAncMyLink').onclick = function(e){ 

// do some stuff here 

    return false; 
    } 

इस तरह आपका कोड जेएस अक्षम उपयोगकर्ताओं के लिए नहीं टूट जाएगा और इसमें चिंताओं का स्पष्ट पृथक्करण होगा।

आशा है कि उपयोग की जा रही है।

Answer 5

मैं आम तौर पर ऑनक्लिक ईवेंट को सेट करने के लिए element.attachEvent (IE) या element.addEventListener (अन्य ब्राउज़र्स) का उपयोग करने की सलाह देता हूं क्योंकि बाद वाले व्यक्ति उस तत्व के लिए किसी मौजूदा ईवेंट हैंडलर को प्रतिस्थापित करेंगे।

attachEvent/addEventListening एकाधिक ईवेंट हैंडलर बनाने की अनुमति देता है।

Answer 6

JQuery उत्तर। चूंकि JavaScript को JQuery विकसित करने के लिए आविष्कार किया गया था, मैं तुम्हें JQuery में एक उदाहरण यह कर दे रहा हूँ:

<div class="menu"> 
    <a href="http://example.org">Example</a> 
    <a href="http://foobar.com">Foobar.com</a> 
</div> 

<script> 
jQuery('div.menu a') 
    .click(function() { 
     do_the_click(this.href); 
     return false; 
    }); 

// play the funky music white boy 
function do_the_click(url) 
{ 
    alert(url); 
} 
</script> 

Answer 7

मैं जावास्क्रिप्ट हाइपरलिंक के लिए href onclick विधि के बजाय का उपयोग करना पसंद। और हमेशा यह निर्धारित करने के लिए अलर्ट का उपयोग करें कि आपके पास क्या मूल्य है।

<a href='#' onclick='jsFunction();alert('it works!');'>Link</a>

यह भी इनपुट टैग जैसे पर इस्तेमाल किया जा सकता है।

<input type='button' value='Submit' onclick='jsFunction();alert('it works!');'>

Answer 8

सभी का सबसे सरल जवाब है ...

<a href="javascript:alert('You clicked!')">My link</a>

या एक जावास्क्रिप्ट समारोह बुलाने की सवाल का जवाब देने:

<script type="text/javascript"> 
 
function myFunction(myMessage) { 
 
    alert(myMessage); 
 
} 
 
</script> 
 

 
<a href="javascript:myFunction('You clicked!')">My link</a>

Answer 9

यदि आप पृष्ठ लोड होने की प्रतीक्षा नहीं करते हैं तो आप आईडी द्वारा तत्व का चयन करने में सक्षम नहीं होंगे। यह समाधान कोड हो रही किसी को भी हो रही परेशानी के लिए काम करना चाहिए निष्पादित करने के लिए

<script type="text/javascript"> 
window.onload = function() { 
    document.getElementById("delete").onclick = function() {myFunction()}; 

    function myFunction() { 
     //your code goes here 
     alert('Alert message here'); 
    } 
}; 
</script> 

<a href='#' id='delete'>Delete Document</a> 

की