Deaktivieren von Links mit JQuery

Question

Ich habe den folgenden Code, der eine Funktion ähnlich der Art und Weise der Kommentar-Link funktioniert hier auf Stackoverflow ... wenn es angeklickt wird, löst ein ActionResult und füllt ein div

   $(function() {
        $("a[id ^='doneLink-']").live('click', function(event) {
            match = this.id.match(/doneLink-(\d+)/);
            container = $("div#doneContainer-" + match[1])
            container.toggle();

            if (container.is(":visible")) {
                container.load($(this).attr("href"));
            } else {
                container.html("Loading...");
            }
            event.preventDefault();
        });
    });

Ich möchte in der Lage sein, eine Dinge zu tun, ändern Sie den Link-Text, von denen sie auf etwas wie "Ausblenden" und auch deaktivieren andere Links in dem kleinen Menü, dass dieser Link befindet.

編集する。 Der zu dieser Funktion gehörende Quelltext sieht folgendermaßen aus

<div id="dc_lifelistmenu"style="float:left;padding-bottom:5px;font-size:10pt;width:400px;">
    <a href="stackoverflow.com/entries/addentry/86">Add Entry</a> | 
    <a href="stackoverflow.com/goals/adddaimoku/86" id="daimokuLink-2">Log Daimoku</a> | 
    <a href="stackoverflow.com/goals/done/86" id="doneLink-2">Mark Completed</a> |
    <a href="stackoverflow.com/goals/remove/86">Remove</a>
</div><br />
<div id='daimokuContainer-2' style="display:none;">  Loading...</div>
<div id='doneContainer-2' style="display:none;">  Loading...</div>

Answer 1

Wenn Sie den Link entfernen möchten, anstatt ihn zu deaktivieren:

jQuery('#path .to .your a').each(function(){
    var $t = jQuery(this);
    $t.after($t.text());
    $t.remove();
});

Anmerkungen:

• Sie können auch function(k,v) verwenden, um einen Iterator und das Element zu erfassen, ohne 'this' zu verwenden
• Wenn Sie den Standard-Namensraum verwenden, können Sie jQuery durch $ ersetzen
• var $t = jQuery(this) ist eine Zwischenspeicherfunktion, die auf das Element verweist und außerdem dazu beiträgt, den Code zu bereinigen
• Es ist eine gute Praxis, Variablen, die eigentlich jQuery-Elemente sind, ein $ voranzustellen, um sie im Code visuell zu trennen. Außerdem können Sie so erkennen, dass Sie Methoden für sie aufrufen können.

Answer 2

Um den Text des Links innerhalb Ihrer Funktion zu ändern, verwenden Sie einfach:

this.text('New Text!');

Um anderen Text zu deaktivieren, müssten wir die Quelle der Seite sehen. Ich bin nicht sicher, was Sie mit "anderen Links" meinen...

UPDATE: Basierend auf Ihrer Bearbeitung, dann schätze ich, was Sie wollen:

$(function() {
        $("a[id ^='doneLink-']").live('click', function(event) {
            match = this.id.match(/doneLink-(\d+)/);
            container = $("div#doneContainer-" + match[1])
            container.toggle();

            if (container.is(":visible")) {
                container.load($(this).attr("href"));
            } else {
                container.html("Loading...");
            }
            event.preventDefault();
            // added
            this.text('Hide');
            // disable others manually, repeat and adjust for each link
            $("#daimokuLink-" + match[1]).toggle();
            // or in one shot, all but the one I clicked
            $("#dc_lifelistmenu:not(#doneContainer-" + match[1] + ")").toggle(); 
        });
    });

UPDATE 2: Ich habe Ihren Kommentar gesehen. Um einen Link zu deaktivieren, anstatt ihn zu verstecken, deaktivieren Sie die onclick durch Überschreiben, anstatt mit toggle() .

$("#daimokuLink-" + match[1]).click(function() { return false; });

Answer 3

Es gibt mehrere Möglichkeiten, dies anzugehen, die einfachste ist wahrscheinlich, einfach etwas zu tun wie: $('a').filter('not:#doneLink').hide(); um alle Links auszublenden, die nicht dem oben angegebenen Link entsprechen.

Auf dieser Seite finden Sie weitere Informationen zu jQuery-Selektoren:

http://docs.jquery.com/Selectors

Answer 4

Der einfachste Weg, Anker zu deaktivieren, ist die Verwendung des Attributs disabled-attribute, aber das Problem ist, dass das angegebene Attribut nur vom IE unterstützt wird. Es funktioniert zum Beispiel nicht in FireFox. Wenn Sie möchten, dass Ihr Code in verschiedenen Browsern funktioniert, können Sie versuchen, die Werte der href- und onclick-Attribute in anderen benutzerdefinierten Attributen zu speichern, um dann href="#" y onclick="return false;" . Wenn Sie "Zurück" aktivieren, sollten Sie die gespeicherten Werte von href und onclick wiederherstellen. Für den visuellen Effekt können Sie eine spezielle CSS-Klasse anwenden. Ich habe diesen Ansatz in meinem Blog beschrieben - Hyperlink deaktivieren