如何通过单击功能在一个区间内停止jquery函数?

时间:2014-09-25 23:57:58

标签: jquery settimeout setinterval

我需要一些帮助来完成我的小代码和#34;经验"。我每次在我的网站上发布通知时都会尝试创建浏览器标签通知。使用以下代码几乎所有工作正常,但有一件事我无法开始工作。

if (stop) return;在代码中间不起作用,但我想在用户关闭通知时将标题标题文本更改回current_title

我对编码并不熟悉,并乐意感谢所有帮助!

var stop = false;
var current_title = $(document).attr('title');
var titles = [
    ">>> Neue Meldung <<<",
    ">> Neue Meldung <<<<",
    "> Neue Meldung <<<<<",
    ">> Neue Meldung <<<<",
    ">>> Neue Meldung <<<",
    ">>>> Neue Meldung <<",
    ">>>>> Neue Meldung <",
    ">>>> Neue Meldung <<"];

function titleCircle(i) {
    if (stop) return;
    i = (!i) ? 0 : (i * 1 + 1) % titles.length;
    $('title').html(titles[i]);
    setTimeout(titleCircle, 1000, [i]);
};

$('div.notice-item-close').click(function () {
    stop = true;
    document.title = current_title;
});

$('.notice-item').each(function () {
    if ($(this).css("display") != "none" || $(this).css("visibility") != "hidden") {
        $(document).load(titleCircle());
    }
});

var notti_get_notice = function () {

    $.ajax({
        type: "POST",
        data: {
            action: 'notti-inotify',
            token: notti_Notice.token
        },
        dataType: "JSON",
        url: notti_Notice.ajaxurl,
        // On Successful Communication
        success: function (data) {

            if (data !== null && data !== undefined) {

                console.log(data);
                jQuery(document).ready(function ($) {

                    var current_title = $(document).attr('title');
                    var stop = false;

                    $('div.notice-item-close').click(function () {
                        stop = true;
                        document.title = current_title;
                    });

                    var titles = [
                        ">>> Neue Meldung <<<",
                        ">> Neue Meldung <<<<",
                        "> Neue Meldung <<<<<",
                        ">> Neue Meldung <<<<",
                        ">>> Neue Meldung <<<",
                        ">>>> Neue Meldung <<",
                        ">>>>> Neue Meldung <",
                        ">>>> Neue Meldung <<"];

                    function titleCircle(i) {
                        if (stop) return;
                        i = (!i) ? 0 : (i * 1 + 1) % titles.length;
                        $('title').html(titles[i]);
                        var timer = setTimeout(titleCircle, 1000, [i]);
                    };
                    $(document).load(titleCircle());
                });


                $.each(data, function (index, value) {
                    if (value.stay === 'false') jQuery.noticeAdd({
                        text: value.text,
                        stay: false,
                        type: value.type
                    });
                    else jQuery.noticeAdd({
                        text: value.text,
                        stay: true,
                        type: value.type
                    });
                });
            }
        }
    });
};

window.setInterval(function () {
    console.log('Fire');
    notti_get_notice();
}, notti_Notice.frequency);

2 个答案:

答案 0 :(得分:0)

您需要为变量分配超时。

var myTitleCircle= window.setTimeout(function());

然后使用clearTimeout

window.clearTimeout(myTitleCircle);

答案 1 :(得分:0)

setInterval可能是更好的解决方案

http://jsfiddle.net/OxyDesign/mhof262o/

JS

$(document).ready(function(){
    var newInterval = window.setInterval(log,1000),
        i = 0;

    function log(){
        console.log('Interval n° '+i);
        i++;
    }

    $('.clear').on('click', function(){
        clearInterval(newInterval);
    });
});