जवाबों:
<a onclick="jsfunction()" href="#">या
<a onclick="jsfunction()" href="javascript:void(0);">संपादित करें:
उपरोक्त प्रतिक्रिया वास्तव में एक अच्छा समाधान नहीं है, जेएस के बारे में बहुत कुछ जानने के बाद से मैंने शुरुआत में पोस्ट किया था। देखें EndangeredMassa का जवाब इस समस्या को हल करने के लिए बेहतर दृष्टिकोण के लिए नीचे दिए गए।
विनीत जावास्क्रिप्ट, कोई पुस्तकालय निर्भरता नहीं:
<html>
<head>
<script type="text/javascript">
// Wait for the page to load first
window.onload = function() {
//Get a reference to the link on the page
// with an id of "mylink"
var a = document.getElementById("mylink");
//Set code to run when the link is clicked
// by assigning a function to "onclick"
a.onclick = function() {
// Your code here...
//If you don't want the link to actually
// redirect the browser to another page,
// "google.com" in our example here, then
// return false at the end of this block.
// Note that this also prevents event bubbling,
// which is probably what we want here, but won't
// always be the case.
return false;
}
}
</script>
</head>
<body>
<a id="mylink" href="http://www.google.com">linky</a>
</body>
</html>hrefयदि मैं उपयोगकर्ता को पुनर्निर्देशित नहीं करना चाहता और केवल कुछ कोड चलाना चाहता हूं तो मैं इसमें क्या डालूंगा ? संपादित करें: मैं देखता हूं कि इसे खाली छोड़ा जा सकता है href="":।
onclickईवेंट को जोड़ना बेहतर क्यों है ? window.onloadonclick<a>
<a href="javascript:alert('Hello!');">Clicky</a>संपादित करें, वर्षों बाद: नहीं! ऐसा कभी मत करो! मैं युवा और बेवकूफ था!
संपादित करें, फिर से: कुछ लोगों ने पूछा है कि आपको ऐसा क्यों नहीं करना चाहिए। कुछ कारण हैं:
प्रस्तुति: HTML प्रस्तुति पर ध्यान केंद्रित करना चाहिए। JS को HREF में रखने का अर्थ है कि आपका HTML अब, थोथा है, जो व्यापारिक तर्क के साथ काम कर रहा है।
सुरक्षा: आपके HTML में जावास्क्रिप्ट जैसे सामग्री सुरक्षा नीति (CSP) का उल्लंघन करता है । सामग्री सुरक्षा नीति (CSP) सुरक्षा की एक अतिरिक्त परत है जो क्रॉस-साइट स्क्रिप्टिंग (XSS) और डेटा इंजेक्शन हमलों सहित कुछ प्रकार के हमलों का पता लगाने और उन्हें कम करने में मदद करती है। इन हमलों का उपयोग डेटा चोरी से लेकर साइट डिफेक्शन या मालवेयर के वितरण तक हर चीज के लिए किया जाता है। यहां अधिक पढ़ें ।
अभिगम्यता: एंकर टैग अन्य दस्तावेजों / पृष्ठों / संसाधनों से जोड़ने के लिए हैं। यदि आपका लिंक कहीं नहीं जाता है, तो यह एक बटन होना चाहिए । यह स्क्रीन पाठकों, ब्रेल टर्मिनलों, आदि के लिए बहुत आसान बनाता है, यह निर्धारित करने के लिए कि क्या चल रहा है, और नेत्रहीनों को उपयोगी उपयोगी जानकारी दें।
href='#'और alert()में onclick?
और, jQuery के साथ विनीत क्यों नहीं:
$(function() {
$("#unobtrusive").click(function(e) {
e.preventDefault(); // if desired...
// other methods to call...
});
});एचटीएमएल
<a id="unobtrusive" href="http://jquery.com">jquery</a>विनीत जावास्क्रिप्ट के बहुत सारे फायदे हैं, यहाँ कदम उठाए गए हैं और इसका उपयोग करना क्यों अच्छा है।
लिंक लोड सामान्य के रूप में:
<a id="DaLink" href="http://host/toAnewPage.html"> यहां क्लिक करें </a>
यह महत्वपूर्ण है क्योंकि यह उन ब्राउज़रों के लिए काम करेगा जिनके जावास्क्रिप्ट सक्षम नहीं हैं, या यदि जावास्क्रिप्ट कोड में कोई त्रुटि है जो काम नहीं करता है।
जावास्क्रिप्ट पेज लोड पर चलता है:
window.onload = function(){
document.getElementById("DaLink").onclick = function(){
if(funcitonToCall()){
// most important step in this whole process
return false;
}
}
}यदि जावास्क्रिप्ट सफलतापूर्वक चलता है, हो सकता है कि वर्तमान पृष्ठ में सामग्री को जावास्क्रिप्ट के साथ लोड कर रहा हो, तो रिटर्न गलत लिंक लिंकिंग को रद्द कर देता है। दूसरे शब्दों में, गलत रिटर्न लगाने पर लिंक को निष्क्रिय करने का प्रभाव पड़ता है अगर जावास्क्रिप्ट सफलतापूर्वक चला। जावास्क्रिप्ट को चलाने की अनुमति नहीं देता है, तो एक अच्छा बैकअप बनाते हुए, ताकि आपकी सामग्री को सर्च इंजन के लिए या तो रास्ता मिल जाए और यदि आपका कोड टूट जाए, या एक गैर-जावास्क्रिप्ट सिस्टम पर देखा जाए।
इस विषय पर सर्वश्रेष्ठ पुस्तक जेरेमी कीथ द्वारा "डॉम सेक्शन" है
या, यदि आप PrototypJS का उपयोग कर रहे हैं
<script type="text/javascript>
Event.observe( $('thelink'), 'click', function(event) {
//do stuff
Event.stop(event);
}
</script>
<a href="#" id="thelink">This is the link</a>jquery के साथ @mister_lucky उत्तर उपयोग पर आधारित:
$('#unobtrusive').on('click',function (e) {
e.preventDefault(); //optional
//some code
});HTML कोड:
<a id="unobtrusive" href="http://jquery.com">jquery</a>बस जावास्क्रिप्ट का उपयोग करें: ---- अनुकरणीय
javascript:var JFL_81371678974472 = new JotformFeedback({ formId: '81371678974472', base: 'https://form.jotform.me/', windowTitle: 'Photobook Series', background: '#e44c2a', fontColor: '#FFFFFF', type: 'false', height: 700, width: 500, openOnLoad: true })