Deaktivieren Sie die Schaltfläche in jQuery

Question

Meine Seite erstellt mehrere Schaltflächen als id = 'rbutton_"+i+"'. Unten ist mein Code:

Klick mich

In Javascript

function disable(i){
    $("#rbutton'+i+'").attr("disabled","disabled");
}

Aber es deaktiviert meine Schaltfläche nicht, wenn ich darauf klicke.

Answer 1

Verwenden Sie stattdessen .prop (und bereinigen Sie Ihren Selektor-String):

function disable(i){
    $("#rbutton_"+i).prop("disabled",true);
}

generiertes HTML:

Klick mich

---

Aber der "Best Practices" Ansatz besteht darin, JavaScript Event-Bindung und this zu verwenden:

$('.rbutton').on('click',function() {
    $(this).prop("disabled",true);
});

Klick mich

http://jsfiddle.net/mblase75/2Nfu4/

Answer 2

Dies ist meiner Meinung nach der einfachste Weg:

// Alle Buttons, deren ID 'rbutton_' enthält
const $buttons = $("button[id*='rbutton_']");

// Auf ausgewählten Button klicken
$buttons.click(function() {
    $(this).prop('disabled', true); //geklickten Button deaktivieren
});

// Button aktivieren beim Klicken
$('#enable').click(() =>
    $buttons.prop('disabled', false); //alle Buttons aktivieren
);

klicken
klicken
klicken
klicken
klicken
klicken
aktivieren

Answer 3

Schaltfläche deaktivieren:

$('#button_id').attr('disabled','disabled');

Schaltfläche aktivieren:

$('#button_id').removeAttr('disabled');

Answer 4

Versuchen Sie diesen Code:
HTML

Klick mich

Funktion

Funktion disable(i){
    $("#rbutton_"+i).attr("disabled","disabled");
}

---

Weitere Lösung mit jQuery

$('button').click(function(){ 
    $(this).attr("disabled","disabled");
});

DEMO

---

Weitere Lösung mit reinem JavaScript

Klick mich

function disable(i){
 document.getElementById("rbutton_"+i).setAttribute("disabled","disabled");
}

DEMO2

Answer 5

Es gibt zwei Dinge hier, und die am höchsten bewertete Antwort ist technisch gesehen korrekt gemäß der Frage des OPs.

Kurz zusammengefasst als:

$("irgendeine Art von Selektor").prop("disabled", true | false);

Wenn Sie jedoch jQuery UI verwenden sollten (ich weiß, der OP hat es nicht getan, aber einige Leute, die hier ankommen könnten es tun), dann wird dies das Klicken auf das Schaltflächenereignis deaktivieren, es wird jedoch nicht bewirken, dass die Schaltfläche gemäß dem UI-Styling deaktiviert aussieht.

Wenn Sie eine mit jQuery UI gestaltete Schaltfläche verwenden, sollte sie aktiviert / deaktiviert werden durch:

$("irgendeine Art von Selektor").button("enable" | "disable");

http://api.jqueryui.com/button/#method-disable