अगर ऑनक्लिक को निष्पादित किया जाता है तो मैं HREF को कैसे अक्षम कर सकता हूं?

Question

मैं के साथ एक लंगर है दोनों HREF और ONCLICKसेट विशेषताओं। यदि क्लिक किया गया और जावास्क्रिप्ट सक्षम किया गया है, तो मैं चाहता हूं कि यह केवल निष्पादित ONCLICKऔर अनदेखा करे HREF। इसी तरह, यदि जावास्क्रिप्ट अक्षम या असमर्थित है, तो मैं चाहता हूं कि यह HREFयूआरएल का पालन करें और अनदेखा करें ONCLICK। नीचे एक उदाहरण है कि मैं क्या कर रहा हूं, जो जेएस को निष्पादित करेगा और लिंक का पालन करेगा (आमतौर पर जेएस निष्पादित होता है और फिर पृष्ठ बदलता है):

<A HREF="http://example.com/no-js-login" ONCLICK="yes_js_login()">Log in</A>

ऐसा करने का सबसे अच्छा तरीका क्या है?

मैं एक जावास्क्रिप्ट उत्तर की उम्मीद कर रहा हूं, लेकिन जब तक यह काम करता है, तब तक मैं किसी भी तरीके को स्वीकार करूंगा, खासकर अगर यह PHP के साथ किया जा सकता है। मैंने पढ़ा है " जावास्क्रिप्ट लिंक निष्पादित करता है और जावास्क्रिप्ट ऑनक्लिक फ़ंक्शन को पूरा करने से पहले पृष्ठ को पुनर्निर्देशित करता है " पहले से ही समाप्त करने में सक्षम है , लेकिन यह केवल देरी HREFकरता है, लेकिन इसे पूरी तरह से अक्षम नहीं करता है। मैं भी बहुत सरल कुछ के लिए देख रहा हूँ।

Comments

मैं एक href के साथ एक एंकर करता और एक बिना। यदि जावास्क्रिप्ट सक्षम है, तो पेज लोड चेक पर, अगर यह सही एंकर दिखा रहा है तो अन्य को दिखाएं।

— ईविन

@ क्यों? यह एक साधारण सुविधा के लिए एक बहुत कुछ मार्कअप की तरह लगता है।

— सुपहस्टार

Answer 1

आप पहले अन-एडिटेड सॉल्यूशन का उपयोग कर सकते हैं, यदि आप पहले रिटर्न को onclickविशेषता में रखते हैं:

<a href="https://example.com/no-js-login" onclick="return yes_js_login();">Log in</a>

yes_js_login = function() {
     // Your code here
     return false;
}

उदाहरण: https://jsfiddle.net/FXkgV/289/

Comments

मुझे पसंद है कि यह कितना साफ है! हालाँकि, स्वीकृत समाधान मुझे अधिक नियंत्रण देता है कि क्या HREF को नजरअंदाज किया जाता है

— Supuhstar

पिछले कुछ वर्षों में मैंने अपना विचार बदल दिया है; यह एक बेहतर उपाय है

— सुपर स्टार

कितना स्वादिस्ट!

— DrunkDevKek

लेकिन यह जेएसएक्स प्रतिक्रिया के साथ काम नहीं कर रहा है। यह काम करेगा?

— कोडर

इसने बहुत समय बचाया।

— मार्क लोज़ानो

Answer 2

    yes_js_login = function() {
         // Your code here
         return false;
    }

यदि आप झूठे लौटते हैं तो यह डिफ़ॉल्ट क्रिया (href पर जाना) को रोकना चाहिए।

संपादित करें: क्षमा करें कि यह काम नहीं करता है, आप इसके बजाय निम्नलिखित कर सकते हैं:

<a href="http://example.com/no-js-login" onclick="yes_js_login(); return false;">Link</a>

Comments

संपादित उत्तर प्रश्न का उत्तर नहीं देता है, क्योंकि यह वास्तविक लिंक को हटा देता है।

— इताई बार-हैम

वापसी के onclick="return yes_js_login();"साथ वैकल्पिक रूप से उपयोग करेंyes_js_loginfalse

— Uwe Kleine-König

@cgogolin मेरा जवाब देखें।

— गाबे रोगन

जो अभी भी अटका हुआ है, वह इस लाइन को जोड़ सकता हैevent.stopImmediatePropagation()

— didxga

Answer 3

बस अपने HTML preventDefaultके eventभीतर डिफ़ॉल्ट ब्राउज़र व्यवहार को अक्षम करें और पास करें ।

<a href=/foo onclick= yes_js_login(event)>Lorem ipsum</a>

yes_js_login = function(e) {
  e.preventDefault();
}

Comments

वापसी झूठी काम नहीं किया बहुलक में ... ऊपर समाधान काम किया ... धन्यवाद

— पारस सच्चरपा

Answer 4

<a href="http://www.google.com" class="ignore-click">Test</a>

jQuery के साथ:

<script>
    $(".ignore-click").click(function(){
        return false;
    })
</script>

जावास्क्रिप्ट के साथ

<script>
        for (var i = 0; i < document.getElementsByClassName("ignore-click").length; i++) {
            document.getElementsByClassName("ignore-click")[i].addEventListener('click', function (event) {
                event.preventDefault();
                return false;
            });
        }
</script>

आप .ignore-clickजितने भी तत्वों को पसंद करते हैं उन पर कक्षा असाइन करते हैं और उन तत्वों पर क्लिक की अनदेखी की जाएगी

Comments

यह एक महान उपाय है! मैंने इसका उपयोग उन बटनों के लिए किया है जो मेरे पास हैं कि जब क्लिक किए .btn-loadingगए लिंक पर एक छद्म वर्ग जोड़ा जाता है, तो यदि सफल चेकमार्क (गलती से एक्स) लोडिंग एनीमेशन को बदल देता है। मैं नहीं चाहता कि बटन को कुछ उदाहरणों (सफलता और त्रुटि दोनों के लिए) में फिर से क्लिक किया जा सके, इसका उपयोग करके मैं अपनी $(elemnent).addClass('disabled')कार्यक्षमता को आसानी से प्राप्त कर सकता हूं और आसानी से प्राप्त कर सकता हूं!

— मैथ्यू Mathieson

Answer 5

आप इस सरल कोड का उपयोग कर सकते हैं:

<a href="" onclick="return false;">add new action</a><br>

Answer 6

यदि आप किसी ईवेंट पैरामीटर को इस तरह पास करते हैं तो यह सरल है:

<a href="#" onclick="yes_js_login(event);">link</a>

function yes_js_login(e) {
    e.stopImmediatePropagation();
}

Comments

यह मेरे लिए काम नहीं करता है। मुझे

— मिलान

Answer 7

यह मदद कर सकता है। कोई JQuery की जरूरत है

<a href="../some-relative-link/file" 
onclick="this.href = 'https://docs.google.com/viewer?url='+this.href; this.onclick = '';" 
target="_blank">

यह कोड निम्न कार्य करता है: Google डॉक्स व्यूअर के सापेक्ष लिंक को पास करें

1. द्वारा लंगर का पूरा लिंक संस्करण प्राप्त करें this.href
2. लिंक को नई विंडो खोलें।

तो आपके मामले में यह काम कर सकता है:

<a href="../some-relative-link/file" 
onclick="this.href = 'javascript:'+console.log('something has stopped the link'); " 
target="_blank">

Answer 8

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

उदाहरण:

<a onclick="http://blahblah" href="http://blahblah" target="_blank">A regular link</a>
<a onclick="javascript:myFunc($(this));return false" href="javascript:myFunc($(this));"  target="_blank">javascript with self reference</a>

हाइपर और ऑनक्लिक विशेषताओं में समान मूल्य हैं, जब मैं एक जावास्क्रिप्ट कॉल करता हूं, तो मैं "रिटर्न असत्य" पर क्लिक करता हूं। कहा फ़ंक्शन में "वापस झूठे" होने से काम नहीं किया।

Comments

दो क्यों हैं? आप जेएस को क्यों डाल रहे हैं HREF?

— Supuhstar

Supuhstar, वास्तविक कोड डायनामिक, जावास्क्रिप्ट है, और बाहरी रूप से परिभाषित कई सौ वस्तुओं के लिए <a> तत्व उत्पन्न करेगा। प्रत्येक आइटम या तो एक स्थैतिक लिंक पते को निर्दिष्ट करेगा, और जहाँ पर उत्पन्न <a> तत्व नियमित "href व्यवहार" का उपयोग करना चाहिए। या, आइटम के लिए एक जावास्क्रिप्ट फ़ंक्शन कॉल निर्दिष्ट किया जाता है, जिसमें तत्व के संदर्भ के आधार पर <a> तत्व के व्यवहार की गणना की जाती है। और <a> जनरेटर के लिए कोड में, मैं बस प्रत्येक तत्व के लिए जो कुछ भी निर्दिष्ट करना चाहता था, उसे कॉपी करना चाहता था, चाहे वह लिंक पता हो या जावास्क्रिप्ट फ़नटेशन कॉल।

— बो योहानसन

मुझे समझ नहीं आता कि यह मेरे सवाल का जवाब कैसे देता है। किसने कहा कि मुझे कई सौ लिंक चाहिए थे? मैं वास्तव में इस सब की बात को नहीं समझता, या आपने जो कुछ कहा है उसका आधा भी।

— सुपर स्टार

Answer 9

यह मेरे लिए काम किया:

<a href="" onclick="return false;">Action</a>

Comments

आपके उत्तर के लिए धन्यवाद और स्टैक एक्सचेंज में आपका स्वागत है! दुर्भाग्य से, यह कोई नया ज्ञान नहीं जोड़ता है, क्योंकि यह लगता है कि पिछले उत्तर पहले से ही यह सुझाव देते हैं। यदि आप सहमत हैं, तो उन लोगों को उभारना बेहतर है। यदि आप असहमत हैं, तो कृपया अपना उत्तर संपादित करें ताकि आपका नया ज्ञान प्रकाश में आए!

— सुपर स्टार

Answer 10

मेरे मामले में, मेरी एक शर्त थी जब उपयोगकर्ता "ए" तत्व पर क्लिक करे। शर्त यह थी:

यदि अन्य अनुभाग में दस से अधिक आइटम थे, तो उपयोगकर्ता को अन्य पृष्ठ पर पुनर्निर्देशित नहीं किया जाना चाहिए।

यदि अन्य अनुभाग में दस से कम आइटम थे, तो उपयोगकर्ता को अन्य पृष्ठ पर पुनः निर्देशित किया जाना चाहिए।

"ए" तत्वों की कार्यक्षमता अन्य घटक पर निर्भर करती है। क्लिक इवेंट के भीतर का कोड निम्नलिखित है:

var elementsOtherSection = document.querySelectorAll("#vehicle-item").length;
if (elementsOtherSection> 10){
     return true;
}else{
     event.preventDefault();
     return false;
}