¿Cómo cambiar el texto de un botón en jQuery?

¿Cómo se cambia el valor del texto de un botón en jQuery? Actualmente, mi botón tiene ‘Agregar’ como valor de texto, y al hacer clic en Quiero cambiar a ‘Guardar’. He intentado este método a continuación, pero hasta ahora sin éxito:

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

Depende del tipo de botón que estés usando

  $("#btnAddProfile").attr('value', 'Save'); //versions older than 1.6  $("#btnAddProfile").prop('value', 'Save'); //versions newer than 1.6   $("#btnAddProfile").html('Save'); 

Tu botón también podría ser un enlace. Necesitará publicar algo de HTML para una respuesta más específica.

EDITAR : Esto funcionará suponiendo que lo haya envuelto en una llamada .click() , por supuesto

EDIT 2 : Las versiones jQuery más nuevas (desde> 1.6) usan .prop lugar de .attr

EDIT 3 : Si está utilizando la interfaz de usuario de jQuery, debe usar el método de DaveUK (a continuación ) para ajustar la propiedad del texto

Para botones creados con .Button () en jQuery ……..

Mientras que las otras respuestas cambiarán el texto, arruinarán el diseño del botón, resulta que cuando se renderiza un botón jQuery, el texto del botón se anida dentro de un intervalo, por ejemplo

  

Si elimina el tramo y lo reemplaza con texto (como en los otros ejemplos), perderá el tramo y el formato asociado.

¡Entonces realmente necesitas cambiar el texto dentro de la etiqueta SPAN y NO el BOTÓN!

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

o (si como yo se está haciendo en un evento de clic)

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

La forma correcta de cambiar el texto del botón si se “abotonó” con JQuery es usar el método .button ():

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

Use .val()

Aquí hay un enlace a JSfiddle

Para cambiar el texto de un botón, simplemente ejecute la siguiente línea de jQuery para

utilizar

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

mientras que para

utilizar esta

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

Tienes que hacer .button("refresh")

HTML :

  

JS :

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

Si has pulsado el botón, parece que funciona:

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

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

Puedes usar algo como esto:

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

También puede agregar propiedades adicionales como esta:

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

Puedes usar

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

a pesar de que

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

funcionaría también, pero es engañoso (da la impresión de que podrías escribir algo así como

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

pero por supuesto no puedes

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

es trabajo para mí html:

  

js

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

¿Le has dado a tu botón una clase en lugar de una identificación? prueba el siguiente código

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

Esto debería funcionar:

 $("#btnAddProfile").prop('value', 'Save'); $("#btnAddProfile").button('refresh'); 
 $("#btnAddProfile").html('Save').button('refresh'); 
 $(document).ready(function(){ $(":button").click(function(){ $("p").toggle(); if (this.value=="Add") this.value = "Save"; else this.value = "Add"; }); }); 
        

This is a paragraph with little content.

This is another small paragraph.

eso es exactamente correcto, esto funciona para mí;

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

¿estás seguro de que Jquery está disponible y que tu código está en el lugar correcto?

 $("#btnviewdetails").click(function(){ if($(this).val()!="hide details"){ $("#detailedoutput").show(); $(this).val('hide details'); }else{ $("#detailedoutput").hide(); $(this).val('view more details'); } }); 
  $( "#btnAddProfile" ).on( "click",function(event){ $( event.target ).html( "Save" ); });