jQuery弃用了'.toggle()'.寻求替代方法

Question

由于.toggle()被弃用从jQuery的,我正在寻找一个新的简单的解决方案,这将使我创造"更多"按钮,滑下一个段落,而改变按钮上的文字为"阅读少".

我把这个工作代码放在一起:

var moreText = "Read more";
var lessText = "Read less";

$(document).ready(function () {
    $("a.readmorebtn").text(moreText);
    $("a.readmorebtn").toggle(function () {
        $("a.readmorebtn").text(lessText);
        $("p.more").slideToggle(0);
    },

    function () {
        $("a.readmorebtn").text(moreText);
        $("p.more").slideToggle(0);
    });
});

http://jsfiddle.net/approach/gDvyR/

您将在小提琴中看到左侧的选项上选中了"Migrate 1.1.0",这是.toggle()使用此(最新)版本的jQuery以这种方式进行工作的唯一方法.

我的问题是,你能想到另一种执行相同功能但不使用.toggle()和迁移的方法吗？

如果你觉得这个问题已在其他地方得到解答,我会道歉,但我一直在寻找解决办法"相对简单"的提示,而没有真正看到任何明确的方法.不幸的是,对jQuery来说,它似乎并不是那么直接!

非常感谢.

Answer 1

我个人认为这里的所有答案都过于精细,无法满足您的需求.这应该做的很好,它适用于多次出现.http://jsfiddle.net/BramVanroy/gDvyR/5/

var moreText = "Read more",
    lessText = "Read less",
    moreButton = $("a.readmorebtn");

moreButton.click(function () {
    var $this = $(this);
    $this.text($this.text() == moreText ? lessText : moreText);
    $this.next("p.more").slideToggle("fast");
});