Désactiver le bouton dans jQuery

Ma page crée plusieurs boutons comme id = 'rbutton_"+i+"'. Voici mon code:

<button type='button' id = 'rbutton_"+i+"' onclick=disable(i);>Click me</button>

En Javascript

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

Mais cela ne désactive pas mon bouton lorsque je clique dessus.

Utilisez à la .propplace (et nettoyez votre chaîne de sélection):

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

HTML généré:

<button id="rbutton_1" onclick="disable(1)">Click me</button>
<!-- wrap your onclick in quotes -->

Mais l'approche des "meilleures pratiques" consiste à utiliser la liaison d'événements JavaScript et à la thisplace:

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

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<button class="rbutton">Click me</button>

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

Essayez ce code:
HTML

<button type='button' id = 'rbutton_'+i onclick="disable(i)">Click me</button>

une fonction

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

Autre solution avec jquery

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

DEMO

Autre solution avec javascript pur

<button type='button' id = 'rbutton_1' onclick="disable(1)">Click me</button>

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

DEMO2

Il y a deux choses ici, et la réponse la plus votée est techniquement correcte selon la question des PO.

Brièvement résumé comme suit:

$("some sort of selector").prop("disabled", true | false);

Cependant, si vous utilisez jQuery UI (je sais que l'OP ne l'était pas, mais certaines personnes arrivant ici pourraient l'être), alors que cela désactivera l'événement de clic sur les boutons, il ne fera pas apparaître le bouton désactivé selon le style de l'interface utilisateur.

Si vous utilisez un bouton de style jQuery UI, il doit être activé / désactivé via:

$("some sort of selector").button("enable" | "disable");

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

C'est le moyen le plus simple à mon avis:

// All buttons where id contains 'rbutton_'
const $buttons = $("button[id*='rbutton_']");

//Selected button onclick
$buttons.click(function() {
    $(this).prop('disabled', true); //disable clicked button
});

//Enable button onclick
$('#enable').click(() =>
    $buttons.prop('disabled', false) //enable all buttons
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="rbutton_200">click</button>
<button id="rbutton_201">click</button>
<button id="rbutton_202">click</button>
<button id="rbutton_203">click</button>
<button id="rbutton_204">click</button>
<button id="rbutton_205">click</button>
<button id="enable">enable</button>

Essaye ça

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

bouton de désactivation:

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

bouton d'activation:

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

Simplement, ça marche bien, en HTML:

<button type="button" id="btn_CommitAll"class="btn_CommitAll">save</button>

Dans le côté JQuery, mettez cette fonction pour le bouton de désactivation:

function disableButton() {
    $('.btn_CommitAll').prop("disabled", true);
}

Pour le bouton d'activation:

function enableButton() {
    $('.btn_CommitAll').prop("disabled", false);
}

C'est tout.

Voici comment vous le faites avec ajax.

$("#updatebtn").click(function () {
    $("#updatebtn").prop("disabled", true);
    urlToHandler = 'update.ashx';
            jsonData = data;
            $.ajax({
                url: urlToHandler,
                data: jsonData,
                dataType: 'json',
                type: 'POST',
                contentType: 'application/json',
                success: function (data) {
                    $("#lbl").html(data.response);
                    $("#updatebtn").prop("disabled", false);
                    //setAutocompleteData(data.response);
                },
                error: function (data, status, jqXHR) {
                    alert('There was an error.');
                    $("#updatebtn").prop("disabled", false);
                }
            }); // end $.ajax

Cela fonctionne pour moi:

<script type="text/javascript">
function change(){
    document.getElementById("submit").disabled = false;
}
</script>

Je veux désactiver le bouton à certaines conditions, j'utilise la 1ère solution mais cela ne fonctionnera pas pour moi. Mais lorsque j'utilise le 2ème, cela a fonctionné. Ci-dessous, les sorties de la console du navigateur.

1. $ ('# psl2 .btn-continue'). Prop ("désactivé", vrai)

<a class=​"btn btn-yellow btn-continue" href=​"#">​Next​</a>​

2. $ ('# psl2 .btn-continue'). Attr ("désactivé", "désactivé")

<a class=​"btn btn-yellow btn-continue" href=​"#" disabled=​"disabled">​Next​</a>​

Pour les boutons Jquery UI, cela fonctionne:

$("#buttonId").button( "option", "disabled", true | false );