如何更改 jQuery 中按钮的文本?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5580616/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to change the text of a button in jQuery?
提问by user517406
How do you change the text value of a button in jQuery? Currently, my button has 'Add' as its text value, and upon being clicked I want it to change to 'Save'. I have tried this method below, but so far without success:
你如何更改 jQuery 中按钮的文本值?目前,我的按钮的文本值是“添加”,点击后我希望它更改为“保存”。我在下面尝试过这种方法,但到目前为止没有成功:
$("#btnAddProfile").attr('value', 'Save');
回答by JohnP
Depends on what type of button you are using
取决于您使用的按钮类型
<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');
Your button could also be a link. You'll need to post some HTML for a more specific answer.
您的按钮也可以是链接。您需要发布一些 HTML 以获得更具体的答案。
EDIT: These will work assuming you've wrapped it in a .click()
call, of course
编辑:.click()
当然,假设您已将其包装在电话中,这些将起作用
EDIT 2: Newer jQuery versions (from > 1.6) use .prop
rather than .attr
编辑 2:较新的 jQuery 版本(来自 > 1.6)使用.prop
而不是.attr
EDIT 3: If you're using jQuery UI, you need to use DaveUK's method (below) of adjusting the text property
编辑 3:如果您使用的是 jQuery UI,则需要使用 DaveUK 的方法(如下)来调整文本属性
回答by DaveUK
For buttons created with .Button() in jQuery........
对于在 jQuery 中使用 .Button() 创建的按钮........
Whilst the other answers will change the text they will mess up the styling of the button, it turns out that when a jQuery button is rendered the text of the button is nested within a span e.g.
虽然其他答案会更改文本,但它们会弄乱按钮的样式,但事实证明,当呈现 jQuery 按钮时,按钮的文本嵌套在一个范围内,例如
<button id="thebutton">
<span class="ui-button-text">My Text</span>
</button>
If you remove the span and replace it with text (as in the other examples) - you'll loose the span and associated formatting.
如果您删除跨度并将其替换为文本(如其他示例中所示) - 您将失去跨度和相关格式。
So you actually need to change the text within the SPAN tag and NOT the BUTTON!
因此,您实际上需要更改 SPAN 标签内的文本,而不是 BUTTON!
$("#thebutton span").text("My NEW Text");
or (if like me it's being done on a click event)
或者(如果像我一样它是在点击事件上完成的)
$("span", this).text("My NEW Text");
回答by Sergey
The correct way of changing the button text if it was "buttonized" using JQuery is to use .button() method:
如果使用 JQuery “按钮化”了按钮文本,则更改按钮文本的正确方法是使用 .button() 方法:
$( ".selector" ).button( "option", "label", "new text" );
回答by Sangeet Menon
To change the text in of a button simply execute the following line of jQuery for
要更改按钮的文本,只需执行以下 jQuery 行即可
<input type='button' value='XYZ' id='btnAddProfile'>
<input type='button' value='XYZ' id='btnAddProfile'>
use
用
$("#btnAddProfile").val('Save');
while for
而对于
<button id='btnAddProfile'>XYZ</button>
<button id='btnAddProfile'>XYZ</button>
use this
用这个
$("#btnAddProfile").html('Save');
$("#btnAddProfile").html('Save');
回答by rsplak
回答by user1464277
You need to do .button("refresh")
你需要做 .button("refresh")
HTML:
HTML:
<button id='btnviewdetails' type='button'>SET</button>
JS:
JS:
$('#btnviewdetails').text('Save').button("refresh");
回答by Gluip
If you have button'ed your button this seems to work:
如果您按下了按钮,这似乎有效:
<button id="button">First caption</button>
$('#button').button();//make it nice
var text="new caption";
$('#button').children().first().html(text);
回答by i_emmanuel
$("#btnAddProfile").text("Save");
$("#btnAddProfile").text("Save");
回答by PurplePier
You can use something like this:
你可以使用这样的东西:
$('#your-button').text('New Value');
You can also add extra properties like this:
您还可以添加额外的属性,如下所示:
$(this).text('New Value').attr('disabled', true).addClass('bt-hud').unbind('click');
回答by gotofritz
You can use
您可以使用
$("#btnAddProfile").text('Save');
although
虽然
$("#btnAddProfile").html('Save');
would work as well, but it's misleading (it gives the impression you could write something like
也可以,但它具有误导性(它给人的印象是您可以编写类似
$("#btnAddProfile").html('Save <b>now</b>');
but of course you can't
但你当然不能