Отключить кнопку в jQuery

Моя страница создает несколько кнопок в качестве id = 'rbutton_"+i+"'. Ниже мой код:

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

В Javascript

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

Но он не отключает мою кнопку, когда я нажимаю на нее.

Ответ 1

Вместо этого используйте .prop (и очистите строку селектора):

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

сгенерированный HTML:

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

Но подход "наилучшей практики" заключается в использовании привязки событий JavaScript и this вместо этого:

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

Ответ 2

Попробуйте этот код:
  HTML

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

функция

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

Другое решение с jquery

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

DEMO


Другое решение с чистым javascript

<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

Ответ 3

Здесь есть две вещи, и самый высокий проголосовавший ответ технически корректен в соответствии с вопросом OP.

Кратко суммируется как:

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

Однако, если вы используете jQuery UI (я знаю, что OP не был, но некоторые люди, прибывающие сюда, могли бы быть), тогда, пока это отключит кнопки, нажмите кнопку, это не приведет к отключению кнопки в соответствии с стилем пользовательского интерфейса.

Если вы используете стилизованную jQuery UI-кнопку, ее следует включить/отключить с помощью:

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

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

Ответ 4

Попробуйте это

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

Ответ 5

Просто он отлично работает, в HTML:

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

В стороне JQuery установите эту функцию для кнопки отключения:

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

Для кнопки включения:

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

Что все.

Ответ 6

Вот как вы это делаете с помощью 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

Ответ 7

отключить кнопку:

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

кнопка включения:

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

Ответ 8

Это работает для меня:

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

Ответ 9

Это самый простой способ, на мой взгляд:

// All buttons where id contains 'rbutton_'
$("button[id*='rbutton_']").click(function() {
          $(this).prop('disabled', true);//disable
     });
$('#enable').click(function(){
    $("button[id*='rbutton_']").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>

Ответ 10

Я хочу отключить кнопку в каком-то состоянии, я использую 1-е решение, но для меня это не сработает. Но когда я использую второй, он работал .Below - выходы из консоли браузера.

1. $('# psl2.btn-continue'). prop ( "disabled", true)

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

2. $('# psl2.btn-continue'). attr ( "отключено", "отключено" )

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