जावास्क्रिप्ट एंक्लिक इवेंट के साथ HTML एंकर टैग

86

Google का उपयोग करने पर मैंने पाया कि वे एंकर टैग में ऑनक्लिक घटनाओं का उपयोग कर रहे हैं।

में अधिक गूगल हैडर भाग में विकल्प, यह सामान्य एक टैग की तरह दिखता है, लेकिन यह पुनः निर्देशित नहीं है onclicking हो लेकिन एक मेनू खोला गया। उपयोग करते समय सामान्य रूप से

<a href='more.php' onclick='show_more_menu()'>More >>></a>

यह आमतौर पर फायरिंग के बिना 'more.php' में जाता है show_more_menu(), लेकिन मुझे उस पेज में एक मेनू दिखाई देता है। गूगल कैसे करें ?

— होशियार बच्चा
स्रोत

117

यदि आपका ऑनक्लिक फ़ंक्शन गलत है तो डिफ़ॉल्ट ब्राउज़र व्यवहार रद्द कर दिया गया है। जैसे की:

<a href='http://www.google.com' onclick='return check()'>check</a>

<script type='text/javascript'>

function check()
{
    return false;
}

</script>

किसी भी तरह से, चाहे वह Google करता हो या नहीं, इसका अधिक महत्व नहीं है। यह जावास्क्रिप्ट के भीतर अपने onclick कार्यों को बांधने के लिए क्लीनर है - इस तरह से आप अपने HTML को अन्य कोड से अलग करते हैं।

— TJHeuvel
स्रोत

3

1. अधिक निश्चित होने के लिए, # href = "#" में एक का उपयोग करें और जावास्क्रिप्ट के भीतर आवश्यक चीजें करें। # Href के साथ उस लिंक पर क्लिक करना सुरक्षित है; पृष्ठ url को छोड़ / पुनः लोड करता है।

— बिमल पौडेल

4

उपरोक्त सलाह को सावधानी के साथ पालन करें, क्योंकि HTML5 नियम स्पष्ट रूप से बताते हैं कि href="#"पृष्ठ के शीर्ष पर नेविगेट करना है। आप बस hrefसामग्री के बिना अटारी जोड़ सकते हैं , और क्लिक व्यवहार प्राप्त कर सकते हैं। #वास्तविक पृष्ठों के लिए url के रूप में मान लेना (बल्कि एकल-पृष्ठ 100% ऊंचाई वाले ऐप्स के लिए) आम तौर पर एक बुरा विचार है।

— माइक 'पोमैक्स' कमेरमन्स

54

आप नीचे दिए गए विकल्प को भी आज़मा सकते हैं:

<a href="javascript:show_more_menu();">More >>></a>

— sun2
स्रोत

1

चेतावनी: यदि फ़ंक्शन कोई भी स्पष्ट मान लौटाता है (उदा: return null;लेकिन नहीं return;), तो इसके कुछ ब्राउज़रों में अनपेक्षित परिणाम होंगे, जैसे कि एक्सफ़ॉक्स। पृष्ठ में स्ट्रिंग प्रारूप में दिए गए मान के साथ प्रतिस्थापित सभी सामग्री होगी (उदा:) [object Object]।

— 22

45

लिंक को क्लिक करने पर मैं जो समझता हूं, आप उसे पुनर्निर्देशित नहीं करना चाहते हैं। तुम कर सकते हो :

<a href='javascript:;' onclick='show_more_menu();'>More ></a>

— आदित्य मनोहर
स्रोत

3

जब आप href को कहीं भी इंगित नहीं करना चाहते हैं तो यह मददगार होता है।

— kbpontius

यह शांत है और यह काम करता है लेकिन jquery एक त्रुटि "त्रुटि: सिंटैक्स त्रुटि, अपरिचित अभिव्यक्ति: जावास्क्रिप्ट:;" फेंकता है

— TheOddCoder

मैं jQuery संस्करण 1.10.2 का उपयोग कर रहा हूं, और मुझे सिंटैक्स त्रुटि नहीं मिलती है जो @TheOddCoder का अनुभव करता है।

— माइक फिंच

1

मेनू को दिखाने के लिए निम्न कोड का उपयोग करें इसके बजाय href ऐड्रेस पर जाएं

function show_more_menu(e) {
  if( !confirm(`Go to ${e.target.href} ?`) ) e.preventDefault();
}

<a href='more.php' onclick="show_more_menu(event)"> More >>> </a>

स्निपेट का विस्तार करें

— कामिल कीलवेज़्स्की
स्रोत