在 jquery 切换中单击时更改按钮文本(显示/隐藏/显示)

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/21214590/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-27 01:28:49  来源:igfitidea点击:

Change button text (show / hide/ show) on click in jquery toggle

jquerybuttontoggle

提问by Skotlive

I am working on this fiddle: http://jsfiddle.net/cED6c/7/I want to make the button text change on click and I tried using the following code:

我正在研究这个小提琴:http: //jsfiddle.net/cED6c/7/我想在点击时更改按钮文本,我尝试使用以下代码:

<input type="button" class="reveal" onClick="this.value=this.value=='Show Answer'?'Hide Answer':'Show Answer'" value="Show Answer">

However, it does not work. How should I implement this? Any help would be great.

但是,它不起作用。我应该如何实施?任何帮助都会很棒。

回答by justtal

You need to add this code:

您需要添加以下代码:

if ($.trim($(this).text()) === 'Show Answer') {
    $(this).text('Hide Answer');
} else {
    $(this).text('Show Answer');        
}

You can see it at work:

你可以在工作中看到它:

http://jsfiddle.net/cED6c/13/

http://jsfiddle.net/cED6c/13/

I add the trim function cause in the html you got space after the Show Answer.

我在显示答案后获得空间的 html 中添加了修剪功能原因。

回答by CRABOLO

Very easy to change the text using jQuery.

使用 jQuery 更改文本非常容易。

Working example here. http://jsfiddle.net/vp7Y7/

这里的工作示例。http://jsfiddle.net/vp7Y7/

$('.reveal').click(function() {
    if ($(this).text() === 'Show Answer') {
         $(this).text('This is NEW TEXT!!! It Worked!');
    }
    else {
        $(this).text('Show Answer');
    }
});

回答by Hos Mercury

something easy like this

像这样简单的事情

 $(document).ready(function () {
    $('a.edit').click(function () {
        var txt = $(this).text();
        txt = (txt !='cancel') ? 'cancel' : 'edit';
        $(this).text(txt);
        $('.editForm').toggle(300);
     });
});