Question

<button class="btn hide_show">Don't show text</button>

$(".hide_show").toggle(function () {
    $(this).text("Show text");
}, function () {
    $(this).text("Don't show text");
});

http://jsfiddle.net/x83qg/1/

我不知道为什么这段代码不起作用。想法是切换按钮的文本

Answer 1

您在toggle上执行的DOM功能已准备好并隐藏按钮，无法再显示该功能。您可能需要更改单击文本。

<强> Live Demo

$(".hide_show").click(function () {
   $(this).text( $(this).text() == "Show text" ? "Don't show text" :"Show text");
});

Answer 2

jQuery最初有两个.toggle()函数。一个toggles visibility，另一个设置click handler that toggles between multiple handlers。使用哪个函数取决于传入的参数。似乎是您尝试使用的后者，但在v1.8中已弃用，在v1.9中已删除。

幸运的是，实现删除的.toggle()：

之类的东西非常容易

var text = ["Show text", "Don't show text"],
    i = 0;
$(".hide_show").click(function () {
    $(this).text(text[i]);
    i = (i + 1) % text.length;
});

演示：http://jsfiddle.net/x83qg/12/

请注意（就像允许两个以上处理程序的旧.toggle()函数一样）我所显示的代码将循环遍历数组中的所有项目，因此您不必仅在两者之间来回切换只有两个项目。

Answer 3

尝试：

var txt = $(".hide_show").text().toLowerCase();
if(txt == "show text"){
    $(".hide_show").text("Don't show text");
}
else{
    $(".hide_show").text("Show text");
}

DEMO here

用jquery切换按钮的文本

3 个答案: