Nút tắt trong jQuery

Trang của tôi tạo ra nhiều nút như id = 'rbutton_"+i+"'. Dưới đây là mã của tôi:

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

Trong Javascript

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

Nhưng nó không vô hiệu hóa nút của tôi khi tôi nhấp vào nó.

Sử dụng .propthay thế (và dọn sạch chuỗi chọn của bạn):

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

HTML được tạo:

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

Nhưng cách tiếp cận "thực tiễn tốt nhất" là sử dụng ràng buộc sự kiện JavaScript và thisthay vào đó:

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

Hãy thử mã này:
HTML

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

chức năng

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

Giải pháp khác với jquery

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

BẢN GIỚI THIỆU

Giải pháp khác với javascript thuần

<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

Có hai điều ở đây, và câu trả lời được bình chọn cao nhất là đúng về mặt kỹ thuật theo câu hỏi của OP.

Tóm tắt ngắn gọn là:

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

Tuy nhiên, nếu bạn đang sử dụng Giao diện người dùng jQuery (tôi biết OP không có nhưng một số người có thể đến đây) thì trong khi điều này sẽ vô hiệu hóa các nút bấm sự kiện, nó sẽ không làm cho nút xuất hiện bị vô hiệu hóa theo kiểu UI.

Nếu bạn đang sử dụng nút theo kiểu UI UI thì nó sẽ được bật / tắt thông qua:

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

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

Đây là cách đơn giản nhất theo ý kiến ​​của tôi:

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

Thử cái này

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

nút vô hiệu hóa:

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

nút bật:

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

Đơn giản là nó hoạt động tốt, trong HTML:

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

Trong phần JQuery, đặt chức năng này cho nút vô hiệu hóa:

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

Đối với nút kích hoạt:

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

Đó là tất cả.

Đây là cách bạn làm điều đó với 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

Điều này làm việc cho tôi:

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

Tôi muốn tắt nút trên một số điều kiện, tôi đang sử dụng giải pháp thứ nhất nhưng nó không hoạt động với tôi. Nhưng khi tôi sử dụng cái thứ 2 thì nó hoạt động. Hiện tại là kết quả đầu ra từ bảng điều khiển trình duyệt.

1. $ ('# psl2 .btn-continue'). Prop ("bị vô hiệu hóa", đúng)

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

2. $ ('# psl2 .btn-continue'). Attr ("bị vô hiệu hóa", "bị vô hiệu hóa")

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

Đối với các nút Jquery UI, công việc này:

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