मैं जावास्क्रिप्ट में एक href लिंक को कैसे निष्क्रिय करूँ?

Question

मेरे पास एक टैग है <a href="#"> Previous </a> 1 2 3 4 <a href="#"> Next </a>और कुछ स्थितियों में मैं चाहता हूं कि यह टैग पूरी तरह से अक्षम हो जाए।

टिप्पणियों से कोड (यह लिंक कैसे उत्पन्न होता है)

if (n_index != n_pages) 
    a = a+'<li><a href="#" onclick="javascript:paginateAjaxPage('+(n_index+1) +','+stype+');">></a></li><li><a href="#" onclick="javascript:paginateAjaxPage('+n_pages+','+stype+');" >>></a></li>'; 
else 
    a = a+'<li><a style="cursor: pointer;" onclick="return false;">></a></li><li><a style="cursor: pointer;" onclick="return false" >>></a></li>'; 
a = a+'</ul></div>';

Comments

कुछ स्थितियों में मैं चाहता हूं कि यह टैग पूरी तरह से अक्षम हो जाए : इसका क्या मतलब है? क्या शर्तें?

— फेलिक्स क्लिंग

विकलांगों से मतलब है कि आप चाहते हैं कि पाठ अभी भी लिंक (अंडरलाइन और सब कुछ) के रूप में दिखाई दे लेकिन क्लिक किए जाने पर कुछ भी न करें?

— शैडो विजार्ड इयर फॉर यू यू

संभावित डुप्लिकेट आप एंकर लिंक को गैर-क्लिक करने योग्य या अक्षम कैसे बनाते हैं?

— इस्माइल

Answer 1

जब आप उपयोगकर्ता को क्लिक पर पुनर्निर्देशित नहीं करना चाहते हैं तो यह कोशिश करें

<a href="javascript: void(0)">I am a useless link</a>

Comments

कैसे के बारे में <a href='javascript:;'>I am a shorter useless link</a>?

— चार्ली श्लिसेर

अर्धविराम की आवश्यकता भी नहीं है।

— mVChr

आप वेब डेवलपर्स लाखों कोड \t, लाइन फीड \nऔर रिक्त स्थान डालते हैं ताकि कोड को मुड़ा और अच्छा (कौन? ब्राउज़र के लिए) देख सकें और अब 7 बाइट्स void(0)और / या ;, हे भगवान के बारे में चिंता कर रहे हैं ।

उपरोक्त टिप्पणी से मैं थोड़ा असहमत हूं। कभी-कभी चीजों को वर्णनात्मक और अन्य मामलों में सरल और याद रखने में आसान होने की आवश्यकता होती है। मैं "जावास्क्रिप्ट:" पसंद करूंगा।

— लैमी

मेरी राय में - Millions millions of tabs\t, line feeds\n and spacesहां, यह कोड को समझने में आसान बनाता है, जबकि void(0)ऐसा नहीं है। इसलिए इसे हटा दिया जाना चाहिए या जितना संभव हो उतना कम होना चाहिए। जैसे यहाँ छोटा - समझने के लिए है (पढ़ने के लिए) "संपीड़न" या बाइट्स ecomony के लिए नहीं। :)

— चेरी

Answer 2

आप इस शैली वर्ग के साथ एक पृष्ठ के सभी लिंक निष्क्रिय कर सकते हैं:

a {
    pointer-events:none;
}

अब निश्चित रूप से ट्रिक लिंक को केवल तभी निष्क्रिय करता है जब आपको आवश्यकता होती है, यह है कि यह कैसे करें:

इस तरह एक खाली वर्ग का उपयोग करें:

a {}

फिर जब आप लिंक को निष्क्रिय करना चाहते हैं, तो यह करें:

    GetStyleClass('a').pointerEvents = "none"

    function GetStyleClass(className)
    {
       for (var i=0; i< document.styleSheets.length; i++) {
          var styleSheet = document.styleSheets[i]

          var rules = styleSheet.cssRules || styleSheet.rules

          for (var j=0; j<rules.length; j++) {
             var rule = rules[j]

             if (rule.selectorText === className) {
                return(rule.style)
             }
          }
       }

       return 0
    }

नोट: सीएसएस नियम नाम कुछ ब्राउज़रों में निचले मामले में बदल जाते हैं, और यह कोड संवेदनशील है, इसलिए इसके लिए बेहतर केस क्लास नामों का बेहतर उपयोग करें

लिंक पुनः सक्रिय करने के लिए:

GetStyleClass('a').pointerEvents = ""

ब्राउज़र संगतता के बारे में जानकारी के लिए इस पृष्ठ http://caniuse.com/pointer-events की जाँच करें

मुझे लगता है कि यह ऐसा करने का सबसे अच्छा तरीका है, लेकिन दुख की बात है कि IE, हमेशा की तरह, इसे अनुमति नहीं देगा :) मैं इसे वैसे भी पोस्ट कर रहा हूं, क्योंकि मुझे लगता है कि इसमें ऐसी जानकारी शामिल है जो उपयोगी हो सकती है, और क्योंकि कुछ प्रोजेक्ट एक पता ब्राउज़र का उपयोग करते हैं , जैसे कि जब आप मोबाइल उपकरणों पर वेब दृश्यों का उपयोग कर रहे हैं।

यदि आप केवल एक लिंक को निष्क्रिय करना चाहते हैं (मुझे केवल यह पता है कि सवाल था), तो मैं उस फ़ंक्शन का उपयोग करूंगा जो उस स्थिति के आधार पर वर्तमान पृष्ठ के url को सेट करता है, या नहीं। (जैसा समाधान आपने स्वीकार किया)

यह सवाल मैंने सोचा था की तुलना में बहुत आसान था :)

Comments

pointer-events:none;मुझे उस टैग के बारे में कभी पता नहीं था, इसके लिए आपको धन्यवाद देना चाहिए , बहुत काम आया!

— ब्राउन

यह शानदार है, लेकिन यह ध्यान देने योग्य है कि पॉइंटर-इवेंट IE में संस्करण 11 से पहले समर्थित नहीं है। caniuse.com/#feat=pointer-events

— JakeRobb

मैंने इसे वैश्विक शैलियों का संपादन करके इस पृष्ठ पर आज़माया था, लेकिन तब मैं आपको

— उभार

बहुत बढ़िया था! एक कठिन समय था जो बिना जुकाम के ऐसा करने का तरीका खोज रहा था।

— हेसाम खाकी

मुझे दूसरों की तुलना में css का उत्तर बेहतर लगता है क्योंकि इसमें लिंक के href को म्यूट करने की आवश्यकता नहीं होती है, जो मेरे मामले में गतिशील है।

— पॉल

Answer 3

आप बस इसे एक खाली हैश दे सकते हैं:

anchor.href = "#";

या यदि वह "अक्षम" के लिए पर्याप्त नहीं है, तो एक घटना हैंडलर का उपयोग करें:

anchor.href = "javascript:void(0)";

Comments

# अनुशंसित नहीं है, क्यों? इस पर विचार करें, आपका अक्षम लिंक एक लंबे पृष्ठ के नीचे / पाद में दिखाई देता है, लिंक पर क्लिक करने से आप शीर्ष पर पहुंच जाएंगे, "जावास्क्रिप्ट:;" पर्याप्त है

— कुमार

# 1 शीर्ष पर वापस नहीं जाएगा

— सेतिया

@ बिक्सी, यह एक आईडी के साथ एक तत्व को स्क्रॉल करेगा 1यदि कोई बाद में जोड़ा जाता है।

— Ps2goat

खैर, यह स्पष्ट है। यह जानते हुए कि केवल एक आईडी = 1 कभी नहीं बनाएं। यह सिर्फ एक संभव समाधान है

— Cétia

यदि आपके पास अपने वर्तमान पृष्ठ से भिन्न <आधार>

— Miguel Pynto

Answer 4

JQuery का उपयोग करके इसे आज़माएं:

$(function () {
    $('a.something').on("click", function (e) {
        e.preventDefault();
    });
});

Answer 5

anchor.href = null;

Comments

क्रोम अब इस जवाब के लिए null नाम के एक पेज पर जाने की कोशिश करता है

— ऑरेंजकिंग

Answer 6

(function ($) {
    $( window ).load(function() {
        $('.navbar a').unbind('click');
        $('.navbar a').click(function () {
            //DO SOMETHING
            return false;
        });
    });
})(jQuery);

मुझे इस तरह से लागू करना आसान लगता है। और इसका यह फायदा है कि आप जे.एस. आपके html के अंदर नहीं है बल्कि एक अलग फाइल में है। मुझे लगता है कि unbind के बिना। दोनों घटनाएँ अभी भी सक्रिय हैं। निश्चित नहीं। लेकिन एक तरह से आपको केवल इस एक घटना की आवश्यकता है

Comments

है unbindआवश्यक? मुझे विश्वास है return falseया e.preventDefault()पर्याप्त होगा।

— तसोस के।

कृपया स्पष्ट करें कि ओपी कोड में क्या गलत है और क्यों यह आपके उत्तर को संपादित करके समस्या को हल करता है ।

— बौम Augen mit

Answer 7

element.removeAttribute(attrName);जब आप इसे अक्षम करना चाहते हैं, तो MDN विशेषता को शून्य (या कुछ अन्य मान) पर सेट करने की अनुशंसा करता है। इस मामले में यह होगाelement.removeAttribute("href");

https://developer.mozilla.org/en-US/docs/Web/API/Element/removeAttribute

Answer 8

किसी लिंक को अक्षम करने का सबसे आसान तरीका यह दिखाना नहीं है। जब भी आप अपनी स्थिति को परखना चाहते हैं तो पिछला बटन छुपाने के लिए इस फ़ंक्शन को चलाएं ( if (true)अपनी स्थिति से बदलें ):

var testHideNav = function() {
    var aTags = document.getElementsByTagName('a'),
        atl = aTags.length,
        i;

    for (i = 0; i < atl; i++) {
        if (aTags[i].innerText == "Previous") {
            if (true) { // your condition to disable previous
                aTags[i].style.visibility = "hidden";
            } else {
                aTags[i].style.visibility = "visible";
            }
        } else if (aTags[i].innerText == "Next") {
            if (false) { // your condition to disable next
                aTags[i].style.visibility = "hidden";
            } else {
                aTags[i].style.visibility = "visible";
            }
        }
    }
};

फिर testHideNav()जब भी आपको अपनी स्थिति बदलनी हो तो चेक बनाने की जरूरत है।

Answer 9

इसके स्थान पर एक स्पैन और एक जावास्क्रिप्ट ऑकलक का उपयोग करें। कुछ ब्राउज़र "कूद" यदि आपके पास एक लिंक है और "#" href है।

Comments

क्या आप एक उदाहरण डाल सकते हैं? कुछ ब्राउज़र "कूद" सही है .. :)

— अरूप रक्षित

आपको देखकर अच्छा लगा, @ArupRakshit =) स्वीकृत उत्तर इसे javascript: void(0);या के साथ करता है javascript:;। यदि आप रेल से प्रतिपादन कर रहे हैं, तो जहाँ आप इसे अक्षम करना चाहते हैं, उसके बजाय बस एक स्पैन प्रदान करें।

— अब्दो

Answer 10

यह भी संभव है:

<a href="javascript:void(0)" onclick="myfunction()">

लिंक आपके फ़ंक्शन द्वारा कहीं भी नहीं जाएगा, निष्पादित किया जाएगा।

Comments

कृपया मौजूदा उत्तर की समीक्षा करें

— ses

Answer 11

मुझे इसी तरह की आवश्यकता थी, लेकिन मेरी प्रेरणा लिंक को डबल-क्लिक करने से रोकने की थी। मैंने इसे jQuery का उपयोग करके पूरा किया:

$(document).ready(function() {
    $("#myLink").on('click', doSubmit);
});

var doSubmit = function() {
    $("#myLink").off('click');
    // do things here
};

HTML इस तरह दिखता है:

<a href='javascript: void(0);' id="myLink">click here</a>

Answer 12

इसलिए उपरोक्त समाधान लिंक को काम नहीं करते हैं, लेकिन इसे दिखाई नहीं देते हैं (AFAICT) कि लिंक अब मान्य नहीं है। मुझे ऐसी स्थिति मिली है जहां मुझे पृष्ठों की एक श्रृंखला मिली है और वर्तमान पृष्ठ पर इंगित करने वाले लिंक को अक्षम करना चाहते हैं (और यह स्पष्ट है कि यह अक्षम है)।

इसलिए:

window.onload = function() {
    var topics = document.getElementsByClassName("topics");
    for (var i = topics.length-1; i > -1; i-- ) {
        for (var j = topics[i].childNodes.length-1; j > -1; j--) {
             if (topics[i].childNodes[j].nodeType == 1) {
                if (topics[i].childNodes[j].firstChild.attributes[0].nodeValue == this.n_root3) {
                    topics[i].childNodes[j].innerHTML = topics[i].childNodes[j].firstChild.innerHTML;
                }
            }
        }
    }
}

यह लिंक की सूची के माध्यम से चलता है, एक को पाता है जो वर्तमान पृष्ठ पर इंगित करता है (n_root3 एक स्थानीय चीज हो सकती है, लेकिन मुझे लगता है कि documentऐसा ही कुछ होना चाहिए), और लिंक पाठ सामग्री के साथ लिंक को बदलता है।

HTH

Answer 13

आप सभी को धन्यवाद...

मेरा मुद्दा नीचे दिए गए कोड द्वारा हल किया गया है:

<a href="javascript:void(0)"> >>> </a>

Comments

इससे पहले कि आप उत्पादन में जाएं मैं इस लिंक की सिफारिश करता हूं -> stackoverflow.com/questions/3125652/…

— कुमार

यह लिंक केवल तभी उपयोगी है जब आप IE6

— Yevgeniy Afanasyev

Answer 14

Jquery के लिए इस प्लगइन को स्थापित करें और इसका उपयोग करें

http://plugins.jquery.com/project/jqueryenabledisable

यह आपको पृष्ठ में किसी भी क्षेत्र को अक्षम / सक्षम करने की अनुमति देता है।

यदि आप किसी शर्त पर एक पृष्ठ खोलना चाहते हैं तो एक जावा स्क्रिप्ट फ़ंक्शन लिखें और इसे href से कॉल करें। यदि शर्त संतुष्ट हो तो आप पृष्ठ खोलें अन्यथा केवल कुछ न करें।

कोड इस तरह दिखता है:

<a href="javascript: openPage()" >Click here</a>

and function:
function openPage()
{
if(some conditon)
opener.document.location = "http://www.google.com";
}
}

आप लिंक को एक div में भी रख सकते हैं और स्टाइल विशेषता की डिस्प्ले प्रॉपर्टी को कोई नहीं पर सेट कर सकते हैं। यह तलाक छिपा देगा। उदाहरण के लिए,

<div id="divid" style="display:none">
<a href="Hiding Link" />
</div>

यह लिंक को छिपा देगा। इस फ़ंक्शन को ऑनक्लिक में कॉल करके इस div को दृश्यमान बनाने के लिए एक बटन या छवि का उपयोग करें:

<a href="Visible Link" onclick="showDiv()">

and write the js code as:

function showDiv(){
document.getElememtById("divid").style.display="block";
}

आप html टैग में आईडी टैग भी लगा सकते हैं, इसलिए यह होगा

<a id="myATag" href="whatever"></a>

और इस id को अपने जावास्क्रिप्ट पर उपयोग करके प्राप्त करें

document.getElementById("myATag").value="#"; 

इसमें से एक निश्चित हा के लिए काम करना चाहिए

Answer 15

लिंक को निष्क्रिय करने का एक और तरीका

element.removeAttribute('href');

बिना href के लंगर टैग अक्षम / सादे पाठ के रूप में प्रतिक्रिया करेगा

<a> w/o href </a>

के बजाय <a href="#"> with href </a>

jsFiddel देखें

उम्मीद है कि यह शानदार है।

Answer 16

शून्य के बजाय आप उपयोग कर सकते हैं:

<a href="javascript:;">this link is disabled</a> 

Answer 17

0) आपको बेहतर याद है कि कुछ ब्राउजर "जंप" करते हैं यदि आपके पास एक लिंक और "#" href है। तो सबसे अच्छा तरीका एक कस्टम जावास्क्रिप्ट होगा

1) यदि आप कस्टम जावास्क्रिप्ट के बाद , यहाँ यह है:

<a href="#" onclick="DoSomething(); return false;">Link</a>

"गलत रिटर्न" लिंक को वास्तव में फॉलो किए जाने से रोकता है।

2) आप निम्नलिखित का उपयोग करने से बच सकते हैं

<a href="javascript:void(0);" onclick="DoSomething();">Link</a>

या

  <a href="javascript:;" onclick="DoSomething();">Link</a>

क्योंकि जावास्क्रिप्ट छद्म-प्रोटोकॉल पृष्ठ को कुछ ब्राउज़रों में प्रतीक्षा की स्थिति में डाल सकता है, जिसके अप्रत्याशित परिणाम हो सकते हैं। IE6 इसके लिए जाना जाता है। लेकिन अगर आप IE6 के बारे में परवाह नहीं करते हैं, और आप सब कुछ परीक्षण कर रहे हैं - यह एक अच्छा समाधान हो सकता है।

3) यदि आपके पास पहले से ही है jQueryऔर bootstrapआपकी परियोजना में है, तो आप उनका उपयोग इस तरह से देख सकते हैं:

$('.one-click').on("click", function (e) {
   $( this ).addClass('disabled');
});

कहाँ पे .disabled कक्षा आ रहा है बूटस्ट्रैप।

Qupte फ़ॉर्म बूटस्ट्रैप साइट ( यहाँ )

लिंक कार्यक्षमता चेतावनी

.Disabled वर्ग pointer-events: nones की लिंक कार्यक्षमता को अक्षम करने का प्रयास करने के लिए उपयोग करता है, लेकिन यह कि CSS संपत्ति अभी तक मानकीकृत नहीं है। इसके अलावा, यहां तक ​​कि उन ब्राउज़र में भी जो पॉइंटर-ईवेंट का समर्थन करते हैं: कोई भी, कीबोर्ड नेविगेशन अप्रभावित रहता है, जिसका अर्थ है कि कीबोर्ड उपयोगकर्ता और सहायक प्रौद्योगिकियों के उपयोगकर्ता अभी भी इन लिंक को सक्रिय करने में सक्षम होंगे। तो सुरक्षित होने के लिए, tabindex="-1"इन लिंक पर एक विशेषता जोड़ें (उन्हें कीबोर्ड फ़ोकस प्राप्त करने से रोकने के लिए) और custom JavaScriptउनकी कार्यक्षमता को अक्षम करने के लिए उपयोग करें।

और custom JavaScriptधारा 1 में दिखाया गया था

Comments

किसी को इसे एक उत्तर के रूप में रखने की आवश्यकता है, बूटस्ट्रैप लोगों ने इसे एक कारण के लिए किया है। भले ही यह एक बुरा विचार है, यह अभी भी एक उत्तर है और स्पष्टीकरण के साथ कि यह विचार बुरा क्यों है इसका उत्तर लोगों के लिए अच्छा है।

— येवगेनी अफानसैयेव

उत्तर में सुधार हुआ

— येवगेनी अफानसयेव

Answer 18

अक्षम लिंक के लिए नीचे कोड:

<a href="javascript: void(0)">test disabled link</a> 

एक और बहुत ही सरल उपाय है:

<a href="#">test disabled link</a>

पहला उपाय कुशल है।

Comments

कृपया पोस्ट करने से पहले मौजूदा उत्तरों की समीक्षा करें। वे विकल्प पहले से ही सुझाए गए थे ... दो साल पहले। पुराने थ्रेड को फिर से जीवित करने के लिए सबसे अच्छा नहीं जब तक कि प्रतिक्रिया मौजूदा उत्तरों पर कुछ महत्वपूर्ण योगदान न दे।

— लेह