Como alterar o texto de um botão no jQuery?

Como você altera o valor do texto de um botão no jQuery? Atualmente, meu botão tem 'Adicionar' como valor de texto e, ao ser clicado, quero que ele mude para 'Salvar'. Eu tentei este método abaixo, mas até agora sem sucesso:

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

Depende do tipo de botão que você está usando

<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');

Seu botão também pode ser um link. Você precisará postar um pouco de HTML para obter uma resposta mais específica.

EDIT : Isso funcionará, desde que você o tenha envolvido em uma .click()chamada, é claro

EDIT 2 : As versões mais recentes do jQuery (de> 1.6) usam em .propvez de.attr

EDIÇÃO 3 : Se você estiver usando a interface do usuário do jQuery, precisará usar o método de DaveUK ( abaixo ) para ajustar a propriedade do texto

Para botões criados com .Button () no jQuery ........

Enquanto as outras respostas alteram o texto, elas atrapalham o estilo do botão, mas quando um botão jQuery é renderizado, o texto do botão é aninhado dentro de um intervalo, por exemplo.

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

Se você remover a extensão e substituí-la por texto (como nos outros exemplos) - você perderá a extensão e a formatação associada.

Então, você realmente precisa alterar o texto na tag SPAN e NÃO no BOTÃO!

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

ou (se como eu, estiver sendo feito em um evento de clique)

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

A maneira correta de alterar o texto do botão se ele foi "abotoado" usando o JQuery é usar o método .button ():

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

Para alterar o texto de um botão, basta executar a seguinte linha de jQuery para

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

usar

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

enquanto para

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

usa isto

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

Usar .val()

Aqui está um link para JSfiddle

Você precisa fazer .button("refresh")

HTML :

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

JS :

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

Se você pressionou o botão, isso parece funcionar:

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

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

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

Você pode usar algo como isto:

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

Você também pode adicionar propriedades extras como esta:

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

Você pode usar

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

Apesar

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

funcionaria também, mas é enganoso (dá a impressão de que você poderia escrever algo como

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

mas é claro que você não pode

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

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

é trabalho para mim html:

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

js

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

Você deu ao seu botão uma classe em vez de um ID? tente o seguinte código

$(".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');
    }

});

Isso deve fazer o truque:

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

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

isso é exatamente correto, isso funciona para mim;

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

você tem certeza que o Jquery está disponível e que seu código está no lugar correto?

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

Alterando o nome da etiqueta do botão em C #.

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

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