GVKun编程网logo

从回调函数内部停止 setInterval(回调函数 中断)

7

本文将带您了解关于从回调函数内部停止setInterval的新内容,同时我们还将为您解释回调函数中断的相关知识,另外,我们还将为您提供关于20180904定时器setTimeout和setInterv

本文将带您了解关于从回调函数内部停止 setInterval的新内容,同时我们还将为您解释回调函数 中断的相关知识,另外,我们还将为您提供关于20180904 定时器setTimeout和setInterval回调问题、javascript – jquery – 从回调函数(在post请求中)返回值到其内部的函数中?、javascript – 为什么函数内部的变量对于在该函数内声明的回调函数是可见的?、javascript – 同一函数中的setInterval和clearInterval的实用信息。

本文目录一览:

从回调函数内部停止 setInterval(回调函数 中断)

从回调函数内部停止 setInterval(回调函数 中断)

如何解决从回调函数内部停止 setInterval?

我在 JavaScript 中使用 setInterval(foo,1000); 在 1 秒后调用名为 foo 的函数。 在函数 foo 中,我正在发送 api 请求以检查某些内容。我想根据 setInterval 中 api 请求的响应停止 foo

解决方法

如您所见,here setInterval 返回一个数字,可与 clearInterval 一起使用以停止间隔。

如果您将该号码存储在某个地方,您可以稍后在回调函数中使用它。

例如:

const map = {}
const foo = () => {
    // ...your async stuff goes here
    clearInterval(map.interval)
}
map.interval = setInterval(foo,1000)

20180904 定时器setTimeout和setInterval回调问题

20180904 定时器setTimeout和setInterval回调问题

引用:

setTimeout和setInterval两者的区别

setTimeout和setInterval的优缺点

setTimeout和setInterval详解

 

两者的作用都是在定时多少毫秒后回调(函数),不同在于

1. 执行次数,setTimeout在一个固定时间后回调一次函数。而setTimeout可以循环回调

  e.g. 1) 定义变量初始值为0,当定时器Timer使用setTimeout回调时,此时变量结果为2(在页面调用一次函数后setTimeout回调一次函数)。

 1 <body onload="myFunction()">
 2     <p id="demo"></p>
 3     <script>
 4         var i = 0;
 5         function myFunction()
 6         {
 7             i++;
 8             document.getElementById("demo").innerHTML = i;
 9             
10         }
11         var timer = setTimeout(function(){myFunction()},500);
12         
13     </script>
14 </body>

  e.g. 2) 同样定义变量初始值为0,当定时器Timer使用setInterval回调时,此时变量呈现每0.5秒加1的计时效果。

 1 <body onload="myFunction()">
 2     <p id="demo"></p>
 3     <script>
 4         var i = 0;
 5         function myFunction()
 6         {
 7             i++;
 8             document.getElementById("demo").innerHTML = i;
 9             
10         }
11         var timer = setInterval(function(){myFunction()},500);
12         
13     </script>
14 </body>

  e.g. 3) 如果把setTimeout计时器写入到函数中,这时也能达到上述第二例的效果(此方法会导致函数运行的内存负担增加,不推荐)

<body onload="myFunction()">
    <p id="demo"></p>
    <script>
        var i = 0;
        function myFunction()
        {
            i++;
            document.getElementById("demo").innerHTML = i;
            var timer = setTimeout(function(){myFunction()},500);
        }
    </script>
</body>

 

今天就先写到这儿吧

javascript – jquery – 从回调函数(在post请求中)返回值到其内部的函数中?

javascript – jquery – 从回调函数(在post请求中)返回值到其内部的函数中?

我有一个 javascript函数,它将数据发布到验证脚本并从那里获取值. post请求的回调函数返回一个布尔值,我试图让整个函数返回该布尔值.现在,回调函数返回正确的值,但函数本身不返回任何内容.这是代码:

function validate(request_type,request_text) {
    $.post("http://www.example.com/ajax/validate.PHP",{
        type: request_type,text: request_text
    },function(data) {
        return (data == "valid");
    });
}

我意识到这是一种“同步”调用,这不是AJAX的意思,但我已经在validate.PHP(数据库调用等)中有很多函数,我无法在Javascript中实现,我看到了像this one这样的线程谈论使用某种形式的处理程序.

当我在if / else语句中使用它时,我将如何编写一个简单的处理程序来使变量数据或布尔比较数据的结果==“有效”(这是应该使用此函数的地方) ?

编辑:例如,将使用布尔结果的if语句之一:

if (!validate('password',pass_new)) {
        $('#pass_new').addClass('error');
        $('#pass_confirm_new').addClass('error');
        $(error_string.format('Please enter a valid password.')).insertAfter('#pass_confirm_new');
        $('#pass_text_short').hide();
        $('#pass_text_long').show();

编辑:在我的HTML表单中使用onsubmit事件调用的函数:

function valid_pass_sett() {
    //code to remove errors left over from prevIoUs submissions - snipped
    pass_old = $('input[name=pass_old]').val();
    pass_new = $('input[name=pass_new]').val();
    pass_confirm_new = $('input[name=pass_confirm_new]').val();
    //some if statements that don't involve AJAX requests - snipped
    if (!validate('password',pass_new)) {
        $('#pass_new').addClass('error');
        $('#pass_confirm_new').addClass('error');
        $(error_string.format('Please enter a valid password.')).insertAfter('#pass_confirm_new');
        $('#pass_text_short').hide();
        $('#pass_text_long').show();
        return false;
    }

    return true;
}

我没有编辑此代码以包含已发布的更新代码,但我的问题是我如何从中返回false来停止表单提交?

解决方法

除非你进行同步AJAX调用(你可能不想这样做),否则你根本做不到.

如果在代码中的多个位置使用此函数,最好的选择可能是允许它接收函数.

这样,您可以直接传递代码,而不是依赖于从函数返回的结果,而是确保能够使用响应.

var my_form = $('#my_form');

my_form.submit( valid_pass_sett );

function valid_pass_sett() {
    //code to remove errors left over from prevIoUs submissions - snipped
    pass_old = $('input[name=pass_old]').val();
    pass_new = $('input[name=pass_new]').val();
    pass_confirm_new = $('input[name=pass_confirm_new]').val();

    validate('password',pass_new,pswd_validation_callback); // async validation

    return false;  // cancel form submission
}

function validate(request_type,request_text,callback ) {
    $.post("http://www.example.com/ajax/validate.PHP",callback );
}

function pswd_validation_callback( data ) {
    if ( data === 'valid' ) {
         // if valid,call the native .submit() instead of the jQuery one
        my_form[ 0 ].submit();
    } else {
         // Otherwise do your thing for invalid passwords.
         // The form has already been canceled,so no concerns there.
        $('#pass_new').addClass('error');
        $('#pass_confirm_new').addClass('error');
        $(error_string.format('Please enter a valid password.')).insertAfter('#pass_confirm_new');
        $('#pass_text_short').hide();
        $('#pass_text_long').show();
    }
}

编辑:更改为使用发布的代码.

编辑:更新以使用已发布的其他代码.为了清晰起见,将答案缩小到命名函数.

javascript – 为什么函数内部的变量对于在该函数内声明的回调函数是可见的?

javascript – 为什么函数内部的变量对于在该函数内声明的回调函数是可见的?

我有一位同事问我为什么无法从回调函数中访问事件参数.事实证明,在调用完成后,jquery似乎将事件设置为null,并创建了一个临时局部变量来修复问题(见下文).

然后这让我思考,为什么“消息”甚至可用于回调.有人可以解释一下吗?

$('some seletor').click({msg: message},function(event){
    alert(event.data.msg); //event.data.msg is not available to the json callback because event is null
    var message = event.data.msg; //message will be available to the callback...why?
    $.getJSON('ajax/test.json',function(data) {
        alert(message); //works ok - why is the message variable visible here at all,should it not have gone out of scope when the above function ended?
        alert(event.data.msg); //will crash,seems that event has been set to null by the framework after the function finished
    });    
});

解决方法

给定范围中存在的任何变量都可用于该范围内定义的所有函数. (这就是如何定义范围在JS中工作,如果您想要了解它的详细信息,this part of the language specification可能是一个很好的切入点).

由于定义回调的函数表达式位于定义变量的函数内部,因此该变量可用.

javascript – 同一函数中的setInterval和clearInterval

javascript – 同一函数中的setInterval和clearInterval

我有这个消息();功能:

function message(kind,text){   
    if(fadeOutDelay != undefined){
       clearInterval(fadeOutDelay);
    }
    $("#message").show();
    $("#message").attr('class',kind);
    $('#message').text(text);
    var fadeOutDelay = setInterval(function(){
        $("#message").fadeOut(2000);
    },10000);
}

问题是我正在尝试清除重新运行该功能的间隔,以防止最新消息的淡入淡出.我希望能够继续发出消息,如果它们彼此间隔10秒,则不会发生淡入淡出.基本上,如果在运行此函数时发生了setInterval,我想取消它.

解决方法

fadeOutDelay不在其他函数调用的范围内.您可以使用全局变量:

var fadeOutDelay;
function message(kind,kind);
    $('#message').text(text);
    fadeOutDelay = setInterval(function(){
        $("#message").fadeOut(2000);
    },10000);
}

今天的关于从回调函数内部停止 setInterval回调函数 中断的分享已经结束,谢谢您的关注,如果想了解更多关于20180904 定时器setTimeout和setInterval回调问题、javascript – jquery – 从回调函数(在post请求中)返回值到其内部的函数中?、javascript – 为什么函数内部的变量对于在该函数内声明的回调函数是可见的?、javascript – 同一函数中的setInterval和clearInterval的相关知识,请在本站进行查询。

本文标签: