JQuery——我想点击一个词来改变它然后再次点击它来改变它答案

【问题标题】：JQuery -- I want to click a word to change it then click it again to change it backJQuery——我想点击一个词来改变它然后再次点击它来改变它
【发布时间】：2013-03-16 06:51:55
【问题描述】：

我希望用户能够点击“你好！”让它变成“再见！”然后再次单击它以将其更改回“你好！”。我已经做到了“你好！”更改为“再见！”，但我不知道如何使功能“重复”。

我是这方面的新手，所以欢迎所有帮助和建议！

据我所知：

HTML：

<body>
   <p id = "greeting">Hello!</p>
</body>

JQuery:

$(function(){
    $("#greeting").click(function(){
        $(this).text('Goodbye!').toggle(hide);
    });
});

【问题讨论】：

标签： jquery toggle switch-statement

【解决方案1】：

$("#greeting").click(function(){
     $(this).text(function(_, oldText) {
         return oldText === 'Goodbye!' ? 'Hello!' : 'Goodbye!';
     });
});

http://jsfiddle.net/DPeWk/

【讨论】：

你能解释一下这行吗：$(this).text(function(_, oldText)
text方法回调函数接受2个参数，第一个是jQuery集合中当前元素的index，第二个是元素当前的textContent，不管你返回什么来自函数的将是元素的新文本内容。
好，但是在index的地方，你传了_，这是什么意思？
@DeadMan - 在这种情况下，index 的值无关紧要，因此将其命名为 _ 以表明不重要。

【解决方案2】：

这是使用toggle 的另一种方法：

HTML

<body>
    <p>Hello!</p>
    <p style="display: none">Goodbye!</p>
</body>

jQuery

$(document).ready(function(){ 
    $("p").click(function () {
        $("p").toggle();
    });
});

你可以在这里测试它：http://jsfiddle.net/zcQkD/2/

在用于切换的 jQuery 文档中有一个与此非常相似的示例：http://api.jquery.com/toggle/

【讨论】：

我们在这里寻找正确和合乎逻辑的答案，而不是像您的答案那样的任何小技巧。
提问者说他希望能够click 'Hello!' to make it change to 'Goodbye!'，而这正是这样做的。他说他是一个新手，欢迎所有帮助/建议，所以即使这是一个“小技巧”，它也是在 jQuery 中执行此操作的有效方法，并且他可以从中找到用处。
好吧，如果你只相信小把戏，那么我会投反对票。您必须编辑答案，以便我可以收回我的反对票，因为我的投票已被锁定。

【解决方案3】：

你也可以试试这个：

$("#greeting").click(function(){
if ($(this).text() == "Hello!")
   $(this).text("Goodbye!")
else
   $(this).text("Hello!");
});

【讨论】：