Désactiver le bouton dans jQuery

Question

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 il ne désactive pas mon bouton lorsque je clique dessus.

Answer 1

Utilisez .prop à la place (et nettoyer 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" est d'utiliser l'événement JavaScript obligatoire et this à la place:

$('.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/

Answer 2

Essayez ce code:
HTML

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

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

Answer 3

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 

Answer 4

simplement c'est bien de travail, en HTML:

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

dans le côté JQuery mettez cette fonction pour le bouton désactiver:

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

Pour bouton activer:

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

C'est tout.

Answer 5

Il y a deux choses ici, et la meilleure réponse est techniquement correcte selon la question OPs.

brièvement résumées comme suit:

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

Toutefois, si vous utilisez jQuery UI (je sais que l'OP n'était pas, mais certaines personnes qui arrivent peut-être ici) puis en cela désactive les boutons cliquez sur l'événement, il ne fera pas le bouton apparaît 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

Answer 6

Cela fonctionne pour moi:

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

Answer 7

C'est la plus simple à mon avis:

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

 
//On click 
 
$buttons.click(function() { 
 
    $(this).prop('disabled', true); //disable 
 
}); 
 

 
//Enable button 
 
$('#enable').click(function(){ 
 
    $buttons.each(function(){ 
 
     $(this).prop('disabled', false); //enable 
 
    }) 
 
})

<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>

Answer 8

Je veux désactiver le bouton sur une condition, j'utilise 1ère solution mais ça ne marchera pas pour moi. Mais quand j'utilise le second, il fonctionne. Ci-dessous sont sorties de la console du navigateur.

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

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

2. $ ('# .btn-continue LSIP2') .attr ("désactivé", "désactivé")

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

Answer 9

Essayez cette

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

Answer 10

bouton Désactiver:

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

bouton Activer:

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