Question

我有以下jquery，当你点击链接时，它只更新文本和类。它在Chrome中运行得非常出色，但在IE中你必须点击两次链接才能执行任何操作。我知道它是否根本不起作用，但无法解决为什么你需要点击它两次！

  // Subscribe to topic subscribedtotopic
    $(".notsubscribedtotopic")
    .on("click", (function () {
        SubscribeUnsubscribe($(this));

    }));


    // UnSubscribe to topic subscribedtotopic
    $(".subscribedtotopic").on("click", (function () {
        SubscribeUnsubscribe($(this));
    }));


    function SubscribeUnsubscribe(link) {

        var topicid = link.attr('rel');
        link.slideUp('fast');
        if (link.attr('class') == 'notsubscribedtotopic') {
            link.html('Unsubscribe From Topic');
            link.removeClass('notsubscribedtotopic').addClass('subscribedtotopic');
            link.slideDown();

            return false;
        } else {
            link.html('Subscribe To Topic');
            link.removeClass('subscribedtotopic').addClass('notsubscribedtotopic');
            link.slideDown();

            return false;
        }

    };

Answer 1

如何删除“return false”？

Answer 2

您可以稍微简化一下代码并使用toggleClass和hasClass以及preventDefault()来摆脱return false：

// Subscribe to topic subscribedtotopic
    $(".notsubscribedtotopic").on("click", function (event) {
        SubscribeUnsubscribe($(this));
        event.preventDefault();
    });


    // UnSubscribe to topic subscribedtotopic
    $(".subscribedtotopic").on("click", function (event) {
        SubscribeUnsubscribe($(this));
        event.preventDefault();
    });

    function SubscribeUnsubscribe(link) {

        var topicid = link.attr('rel');
        link.slideUp('fast', function(){
            if (link.hasClass('notsubscribedtotopic')) {
                link.html('Unsubscribe From Topic');
            } else {
                link.html('Subscribe To Topic');
            }

            link.toggleClass('notsubscribedtotopic').toggleClass('subscribedtotopic');
            link.slideDown();
        });
    }

从技术上讲，如果你给链接另一个没有改变的类，那么两个事件处理程序也可以替换为一个。

jquery removeClass（''）。addClass（''）在IE中需要两次点击

2 个答案: