JQuery का उपयोग करके एंकर को सक्षम या अक्षम कैसे करें?

Question

JQuery का उपयोग करके एंकर को सक्षम या अक्षम कैसे करें?

Comments

आपके सभी उत्तर के लिए धन्यवाद, फिर भी यह काम नहीं कर रहा है, तो कृपया आप इसे दस्तावेज़ के साथ काम कर सकते हैं। पहले से ही फ़ंक्शन

— सेंथिल कुमार भास्करन

यदि आप कोड का स्निपेट पोस्ट कर रहे हैं जो काम नहीं कर रहा है तो यह मदद कर सकता है।

— हुर्रे इम की सहायता से

वास्तव में मेरा कोडिंग रेल में है और मेरी कोडिंग <% = foo.add_associated_link ('ईमेल जोड़ें', @ project.email.build)%> जब मैं इसे ब्राउज़र में प्रस्तुत करता हूं तो मैं ईमेल देख सकता हूं, लेकिन मैं इसे अक्षम भी नहीं कर सकता e.preventDefault () के रूप में कोडिंग के साथ कोशिश की, लेकिन कोई नतीजा नहीं आया

— सेंथिल कुमार भास्करन

Answer 1

एक एंकर को निर्दिष्ट का पालन करने से रोकने के लिए href, मैं उपयोग करने का सुझाव दूंगा preventDefault():

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

// jQuery < 1.7
$(function () {
    $('a.something').click(function (e) {
        e.preventDefault();
    });

    // or 

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

देख:

http://docs.jquery.com/Events/jQuery.Event#event.preventDefault.28.29

इसके अलावा SO पर यह पिछला प्रश्न देखें:

jQuery एक लिंक को अक्षम करता है

Comments

मैं उन "attr" के साथ की कोशिश की यह केवल एंकर टैग पर नहीं तत्व तत्व पर काम कर रहा है।

— सेंथिल कुमार भास्करन

@ सेंथिल - रोकाफॉल्ट को ऐसा करने का 'उचित' तरीका माना जाता है, मेरा संपादन देखें (दूसरे Q + A से लिंक)

— karim79

वास्तव में मेरा कोडिंग रेल में है और मेरी कोडिंग <% = foo.add_associated_link ('ईमेल जोड़ें', @ project.email.build)%> है जब मैं इसे ब्राउज़र में प्रस्तुत करता हूं तो मैं ईमेल देख सकता हूं लेकिन मैं इसे अक्षम भी नहीं कर सकता e.preventDefault () के परिणाम के रूप में कोडिंग के साथ प्रयास किया गया

— सेंथिल कुमार भास्करन

मैं कैसे उल्टा करता हूँ $('a.something').on("click", function (e) { e.preventDefault(); });?

— ア ッ ク

असहमत, CSS का उपयोग करें "पॉइंटर-ईवेंट: कोई नहीं;" इसके बजाय, बस अन्य unswers में की तरह।

— विट्रिलो

Answer 2

वर्तमान में मैं जिस ऐप पर काम कर रहा हूं वह जावास्क्रिप्ट के साथ संयोजन में सीएसएस शैली के साथ करता है।

a.disabled { color:gray; }

फिर जब भी मैं एक लिंक को अक्षम करना चाहता हूं मैं कॉल करता हूं

$('thelink').addClass('disabled');

फिर, 'thelink' एक टैग के लिए क्लिक हैंडलर में मैं हमेशा एक चेक पहली चीज़ चलाता हूं

if ($('thelink').hasClass('disabled')) return;

Comments

क्या पिछली पंक्ति को यह नहीं कहना चाहिए कि "झूठे लौटें?"

— प्रेस्टाटूल

गुड कॉल, प्रेस्टुल। <a> टैग से बंधा होने पर, मैं उपयोग कर रहा हूं: <a href="whatever" onclick="return disableLink(this)"> .. फिर: फ़ंक्शन अक्षम करें (नोड) {if (dojo.hasClass (नोड,) 'अक्षम') गलत लौटें; dojo.addClass (नोड, 'अक्षम'); वापसी सही;} .. यह लिंक को एक बार क्लिक करने की अनुमति देता है और कार्रवाई (वापसी सच) और उसके बाद यह कार्रवाई (रिटर्न) की अनुमति नहीं देता है false)

— नेक

ध्यान दें कि हैंडलर में आपको शायद $ ("thelink") के बजाय $ (इस) का उपयोग करना चाहिए क्योंकि वह बदल सकता है या उपयोगकर्ता उस तरह से कोड को आसानी से कॉपी / पेस्ट कर सकता है।

— एलेक्सिस विलके

सुझाव दें कि आप विकलांग शैली में 'कर्सर: डिफ़ॉल्ट' भी जोड़ सकते हैं।

— स्टुअर्ट हॉलोज़

Answer 3

मुझे एक जवाब मिला कि मुझे यहां बहुत अच्छा लगता है

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

$(document).ready(function(){
    $("a").click(function () { 
        $(this).fadeTo("fast", .5).removeAttr("href"); 
    });
});

सक्षम करने में href विशेषता सेट करना शामिल होगा

$(document).ready(function(){
    $("a").click(function () { 
        $(this).fadeIn("fast").attr("href", "http://whatever.com/wherever.html"); 
    });
});

इससे आपको पता चलता है कि लंगर तत्व सामान्य पाठ बन जाता है, और इसके विपरीत।

Answer 4

$("a").click(function(){
                alert('disabled');
                return false;

}); 

Answer 5

मुझे लगता है कि एक अच्छा समाधान निष्क्रिय डेटा विशेषता को सेट करना है और क्लिक पर इसके लिए चेक एंकर करना है। इस तरह हम अस्थायी रूप से एक लंगर को निष्क्रिय कर सकते हैं जब तक कि जावास्क्रिप्ट को अजाक्स कॉल या कुछ गणनाओं के साथ समाप्त नहीं किया जाता है। यदि हम इसे अक्षम नहीं करते हैं, तो हम इसे कुछ बार क्लिक कर सकते हैं, जो अवांछनीय है ...

$('a').live('click', function () {
    var anchor = $(this);

    if (anchor.data("disabled")) {
        return false;
    }

    anchor.data("disabled", "disabled");

    $.ajax({
        url: url,
        data: data,
        cache: false,
        success: function (json) {
            // when it's done, we enable the anchor again
            anchor.removeData("disabled");
        },
        error: function () {
             // there was an error, enable the anchor
            anchor.removeData("disabled");
        }
    });

    return false;
});

मैंने एक jsfiddle उदाहरण दिया: http://jsfiddle.net/wgZ59/76/

Answer 6

चयनित उत्तर अच्छा नहीं है।

पॉइंटर-ईवेंट सीएसएस शैली का उपयोग करें । (जैसा कि रशद अन्नारा ने सुझाव दिया)

MDN https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events देखें । अधिकांश ब्राउज़रों में इसका समर्थन किया गया।

एंकर के लिए सरल "अक्षम" विशेषता जोड़ने का काम करेगा यदि आपके पास वैश्विक सीएसएस नियम निम्नलिखित हैं:

a[disabled], a[disabled]:hover {
   pointer-events: none;
   color: #e1e1e1;
}

Comments

पॉइंटर-ईवेंट के साथ आपको इसमें शामिल करने की आवश्यकता नहीं होगी: हॉवर स्थिति यह है कि एक पॉइंटर ईवेंट है। आपको केवल एक [विकलांग] चयनकर्ता शामिल करना होगा।

— लैरी ड्यूक

Answer 7

नीचे की पंक्तियों को आज़माएँ

$("#yourbuttonid").attr("disabled", "disabled");
$("#yourbuttonid").removeAttr("href");

Coz, भले ही आप <a>टैग hrefको अक्षम कर दें, फिर hrefभी आपको हटाना होगा ।

जब आप सक्षम करना चाहते हैं लाइनों के नीचे का प्रयास करें

$("#yourbuttonid").removeAttr("disabled");
$("#yourbuttonid").attr("href", "#nav-panel");

Comments

यह वही है जो मुझे ASP.NET MVC एक्शनलिंक के साथ JQuery का उपयोग करते समय आवश्यक था। धन्यवाद!

— ईगलीन 22

Answer 8

यह उतना ही सरल है जितना कि असत्य;

पूर्व।

jQuery("li a:eq(0)").click(function(){
   return false;
})

या

jQuery("#menu a").click(function(){
   return false;
})

Answer 9

$('#divID').addClass('disabledAnchor');

सीएसएस फ़ाइल में

.disabledAnchor a{
       pointer-events: none !important;
       cursor: default;
       color:white;
}

Answer 10

$("a").click(function(event) {
  event.preventDefault();
});

यदि इस विधि को कॉल किया जाता है, तो ईवेंट की डिफ़ॉल्ट क्रिया ट्रिगर नहीं होगी।

Answer 11

यदि आप उस पृष्ठ के साथ सभी इंटरैक्शन को ब्लॉक करने का प्रयास कर रहे हैं जिसे आप jQuery के ब्लॉकयूआई प्लगइन पर देखना चाहते हैं

Answer 12

आपने कभी भी यह निर्दिष्ट नहीं किया कि आप उन्हें कैसे अक्षम करना चाहते हैं, या अक्षम करने का क्या कारण होगा।

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

Answer 13

उन स्थितियों के लिए जहां आपको एक एंकर टैग के भीतर पाठ या HTML सामग्री डालनी होगी, लेकिन आप बस उस तत्व को क्लिक करने पर कोई कार्रवाई नहीं करना चाहते (जैसे जब आप चाहते हैं कि एक निष्क्रिय लिंक लिंक अक्षम अवस्था में होना चाहिए क्योंकि यह है वर्तमान पृष्ठ), बस बाहर href कट। ;)

<a>3 (current page, I'm totally disabled!)</a>

@ माइकल-मीडोज द्वारा दिए गए उत्तर ने मुझे इस बात से इत्तला कर दी, लेकिन अभी भी उन परिदृश्यों को संबोधित कर रहा है जहाँ आपको अभी भी jQuery / JS के साथ काम करना है। इस स्थिति में, यदि आपके पास html लिखने पर नियंत्रण है, तो बस href टैग को x-ing करना होगा, इसके लिए आपको केवल एक शुद्ध HTML एक का समाधान करना होगा!

JQuery फ़ाइनग्लिंग के बिना अन्य समाधान जो href रहते हैं, आपको href में # डालने की आवश्यकता होती है, लेकिन इससे पृष्ठ शीर्ष पर उछलता है, और आप चाहते हैं कि यह सादा पुराना अक्षम हो। या इसे खाली छोड़ रहा है, लेकिन ब्राउज़र पर निर्भर करता है, जो अभी भी शीर्ष पर कूदने जैसा सामान करता है, और, यह आईडीई के अनुसार अमान्य HTML है। लेकिन जाहिरा तौर पर एक aटैग एक एचआरईएफ के बिना पूरी तरह से वैध HTML है।

अंत में, आप कह सकते हैं: ठीक है, क्यों नहीं एक टैग पूरी तरह से डंप? क्योंकि अक्सर आप नहीं कर सकते हैं, aटैग का उपयोग CSS फ्रेमवर्क में स्टाइल के उद्देश्यों के लिए किया जाता है या आपके द्वारा उपयोग किए जा रहे नियंत्रण की तरह, बूटस्ट्रैप के पेजर की तरह:

http://twitter.github.io/bootstrap/components.html#pagination

Answer 14

तो ऊपर की प्रतिक्रियाओं के संयोजन के साथ, मैं इस के साथ आया।

a.disabled { color: #555555; cursor: default; text-decoration: none; }

$(".yourClass").addClass("disabled").click(function(e){ e.preventDefault(); 

Answer 15

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

<a class="MyLink" href="http://www.google.com"><span>My</span> <strong>Link</strong></a>

फिर jquery का उपयोग करके आप ऐसा कर सकते हैं जब आपको लिंक के बजाय पाठ प्रदर्शित करने की आवश्यकता होती है।

var content = $(".MyLink").text(); // or .html()
$(".MyLink").replaceWith("<div>" + content + "</div>")

तो इस तरह, हम एंकर टैग को डिव टैग से बदल सकते हैं। यह बहुत आसान है (सिर्फ 2 लाइनें) और शब्दार्थ रूप से सही है (क्योंकि हमें अब लिंक की आवश्यकता नहीं है इसलिए लिंक नहीं होना चाहिए)

Answer 16

अक्षम संपत्ति के साथ किसी भी तत्व को अक्षम या सक्षम करें।

// Disable 
$("#myAnchor").prop( "disabled", true );

// Enable
$( "#myAnchor" ).prop( "disabled", false );

Comments

इस जवाब को वोट क्यों दिया जाता है? यह प्रश्न का उत्तर देता है "jQuery का उपयोग करके एंकर को सक्षम या अक्षम कैसे करें?"

— रिची डी

मेरा मानना ​​है कि एंकर पर क्लिक करने के बाद भी लिंक खुले रहते हैं।

— ज़ोम्बाय