Question Comment changer le texte d'un bouton dans jQuery?


Comment changer la valeur du texte d'un bouton dans jQuery? Actuellement, mon bouton a 'Ajouter' comme valeur de texte, et lorsque je clique dessus, je veux qu'il change en 'Sauvegarder'. J'ai essayé cette méthode ci-dessous, mais jusqu'à présent sans succès:

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

424
2018-04-07 11:56


origine


Réponses:


Dépend de quel type de bouton vous utilisez

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

Votre bouton pourrait également être un lien. Vous aurez besoin de poster du HTML pour une réponse plus spécifique.

MODIFIER : Ceux-ci vont fonctionner en supposant que vous l'avez enveloppé dans un .click() appel, bien sûr

EDIT 2 : Les versions récentes de jQuery (à partir de> 1.6) utilisent .prop plutôt que .attr

EDIT 3 : Si vous utilisez jQuery UI, vous devez utiliser la méthode de DaveUK (au dessous de) d'ajuster la propriété de texte


702
2018-04-07 11:59



Pour les boutons créés avec .Button () dans jQuery ........

Alors que les autres réponses changeront le texte qu'ils gâchera le style du bouton, il se trouve que lorsqu'un bouton jQuery est rendu le texte du bouton est imbriqué dans une période par exemple

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

Si vous supprimez la plage et que vous la remplacez par du texte (comme dans les autres exemples), vous perdrez la plage et le formatage associé.

Donc, vous avez réellement besoin de changer le texte dans la balise SPAN et non le bouton!

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

ou (si comme moi c'est fait sur un clic)

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

126
2018-01-06 09:24



La bonne façon de changer le texte du bouton si elle était « buttonized » en utilisant JQuery est d'utiliser la méthode .button ():

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

74
2018-05-23 18:06



Utilisation .val()

Voici un lien vers JSfiddle


32
2018-04-07 11:57



Pour changer le texte d'un bouton, exécutez simplement la ligne suivante de jQuery pour

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

utilisation

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

tandis que pour

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

utilisez ceci

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


29
2018-04-07 12:18



Tu as besoin de faire .button("refresh")

HTML :

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

JS :

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

18
2017-07-20 16:32



Si vous avez cliqué sur votre bouton, cela semble fonctionner:

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

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

11
2017-07-25 20:27



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


8
2017-10-25 21:47