Làm cách nào để thay đổi văn bản của một nút trong jQuery?

Làm thế nào để bạn thay đổi giá trị văn bản của một nút trong jQuery? Hiện tại, nút của tôi có 'Thêm' làm giá trị văn bản của nó và khi được nhấp, tôi muốn nó thay đổi thành 'Lưu'. Tôi đã thử phương pháp này dưới đây, nhưng cho đến nay không thành công:

$("#btnAddProfile").attr('value', 'Save');

Phụ thuộc vào loại nút bạn đang sử dụng

<input type='button' value='Add' id='btnAddProfile'>
$("#btnAddProfile").attr('value', 'Save'); //versions older than 1.6

<input type='button' value='Add' id='btnAddProfile'>
$("#btnAddProfile").prop('value', 'Save'); //versions newer than 1.6

<!-- Different button types-->

<button id='btnAddProfile' type='button'>Add</button>
$("#btnAddProfile").html('Save');

Nút của bạn cũng có thể là một liên kết. Bạn sẽ cần đăng một số HTML để có câu trả lời cụ thể hơn.

EDIT : Những thứ này sẽ hoạt động giả sử bạn đã kết thúc .click()cuộc gọi, dĩ nhiên

EDIT 2 : Các phiên bản jQuery mới hơn (từ> 1.6) sử dụng .propthay vì.attr

EDIT 3 : Nếu bạn đang sử dụng jQuery UI, bạn cần sử dụng phương pháp của DaveUK ( bên dưới ) để điều chỉnh thuộc tính văn bản

Đối với các nút được tạo bằng .Button () trong jQuery ........

Trong khi các câu trả lời khác sẽ thay đổi văn bản, chúng sẽ làm rối kiểu dáng của nút, nhưng hóa ra khi nút jQuery được hiển thị, văn bản của nút được lồng trong một khoảng, ví dụ

<button id="thebutton">
  <span class="ui-button-text">My Text</span>
</button>

Nếu bạn xóa khoảng và thay thế nó bằng văn bản (như trong các ví dụ khác) - bạn sẽ mất khoảng và định dạng liên quan.

Vì vậy, bạn thực sự cần phải thay đổi văn bản trong thẻ SPAN và KHÔNG PHẢI LÀ NÚT!

$("#thebutton span").text("My NEW Text");

hoặc (nếu như tôi, nó được thực hiện trên một sự kiện nhấp chuột)

$("span", this).text("My NEW Text");

Cách chính xác để thay đổi văn bản nút nếu nó được "nút" bằng cách sử dụng JQuery là sử dụng phương thức .button ():

$( ".selector" ).button( "option", "label", "new text" );

Để thay đổi văn bản trong một nút, chỉ cần thực hiện dòng jQuery sau đây cho

<input type='button' value='XYZ' id='btnAddProfile'>

sử dụng

$("#btnAddProfile").val('Save');

trong khi cho

<button id='btnAddProfile'>XYZ</button>

dùng cái này

$("#btnAddProfile").html('Save');

Sử dụng .val()

Đây là một liên kết đến JSfiddle

Bạn cần phải làm .button("refresh")

HTML :

<button id='btnviewdetails' type='button'>SET</button>

JS :

$('#btnviewdetails').text('Save').button("refresh");

Nếu bạn đã nhấn nút, nút này dường như hoạt động:

<button id="button">First caption</button>

$('#button').button();//make it nice
var text="new caption";
$('#button').children().first().html(text);

$("#btnAddProfile").text("Save");

Bạn có thể sử dụng một cái gì đó như thế này:

$('#your-button').text('New Value');

Bạn cũng có thể thêm các thuộc tính bổ sung như thế này:

$(this).text('New Value').attr('disabled', true).addClass('bt-hud').unbind('click');

Bạn có thể dùng

$("#btnAddProfile").text('Save');

Mặc du

$("#btnAddProfile").html('Save');

cũng sẽ hoạt động tốt, nhưng nó gây hiểu lầm (nó mang lại ấn tượng bạn có thể viết một cái gì đó như

$("#btnAddProfile").html('Save <b>now</b>');

nhưng tất nhiên bạn không thể

document.getElementById('btnAddProfile').value='Save';

$("#btnAddProfile").click(function(){
    $("#btnAddProfile").attr('value', 'Save');
 });

nó hoạt động với tôi html:

<button type="button" class="btn btn-primary" id="btnSaveSchedule">abc</button>

js

$("#btnSaveSchedule").text("new value");

Bạn đã cho nút của bạn một lớp thay vì một id? thử đoạn mã sau

$(".btnSave").attr('value', 'Save');

$("#btnviewdetails").click(function(){
    if($(this).val()!="hide details"){
        $("#detailedoutput").show();
        $(this).val('hide details');
    }else{
        $("#detailedoutput").hide();
        $(this).val('view more details');
    }

});

Cái này cần phải dùng mẹo:

$("#btnAddProfile").prop('value', 'Save');       
$("#btnAddProfile").button('refresh');

$("#btnAddProfile").html('Save').button('refresh');

điều đó hoàn toàn chính xác, điều này hiệu quả với tôi;

    $('#btnAddProfile').bind('click',function(){
    $(this).attr('value','save');
})

Bạn có chắc chắn Jquery có sẵn và mã của bạn đang ở đúng nơi?

    $( "#btnAddProfile" ).on( "click",function(event){
    $( event.target ).html( "Save" );
});

Thay đổi tên của nghi thức nút trong C #.

<button type="submit" name="add" id="btnUpdate" class="btn btn-primary" runat="server" onserverclick="btnUpdate_Click">
Add

btnUpdate.**InnerText** = "Update";