Question

我需要访问var＆＃34; cont＆＃34;每个循环运行后。如果cont = true，我需要运行一个电子邮件，这是在每个循环中的ajax调用之后设置的。我已经读过每个循环是同步的，但是当我在每个循环后控制log var cont时，即使设置为true，我也会得到假。

$(".check").click(function (event) {
    var cont = false;
    event.preventDefault();
    $("form.form").each(function (index) {
        var $this = $(this);
        var name = $this.find('input.name').val();
        var company = $this.find('input.comp_name').val();
        var jtitle = $this.find('input.job_title').val();
        var link = $this.find('input.link').val();
        var email = $('input.email').val();

        if ((name === "") || (company === "") || (jtitle === "")) {
            $this.addClass("NotFilled");
        } else {
            var url = $this.attr('action');
            // fetch the data for the form
            var data = $this.serializeArray();
            $.ajax({
                url: url,
                data: data,
                type: "post",
                success: function (result) {
                    if (result === "success") {
                        cont = true;
                        $this.removeClass("NotFilled").addClass("filled");
                        //console.log(cont)  I Get True here
                    } else {
                        cont = false;
                        $this.removeClass("filled").addClass("NotFilled");
                    }
                    return cont;
                }

            });
        }
    });
    //console.log(cont)  I Get false here
    if (cont === "true") {
        $.post("<?php bloginfo('template_url'); ?>/x/x.php", {
            emailTo: email,
            emailFrom: 'x@x.co.uk',
            subject: 'New x x x',
            message: 'We x x x'
        },

               function (data) {});
    }
});

Answer 1

each方法中的代码是ajax，它本质上是异步的。

所以声明

if(cont === "true"){

即使在ajax调用成功/失败之前也会执行。

因此，您必须通过设置async标志将ajax转换为同步，或将if条件置于回调中。

同步ajax调用示例：

 $.ajax({
    url: url,
    data: data,
    async: false

    type: "post",
    success: function (result) {
        if (result === "success") {
            cont = true;
            $this.removeClass("NotFilled").addClass("filled");
            //console.log(cont)  I Get True here
        } else {
            cont = false;
            $this.removeClass("filled").addClass("NotFilled");
        }
        return cont;
    }

});

Answer 2

由于您的调用是异步的，因此代码的执行将在ajax调用之后直接继续。

您可以设置$.ajaxSetup({async: false});让您的代码等待执行ajax调用，并在执行后设置$.ajaxSetup({async: true});。

Answer 3

像@mohamedrias一样说：javascript从它的核心是异步的。这意味着if语句在ajax调用返回成功或失败之前执行

考虑以下代码：

console.log('First');
jQuery.get('page.html', function(data) {
  console.log("Second");
});
console.log('Third');

在此片段中，您的控制台将记录：First，Third，Second。

现在，如果我们要让它运行async：

console.log('First');
getPage("page.html, function(){
  console.log('Third');          
}


var getPage(url, callback) {
  jQuery.get(url, function(data) {
    console.log("Second ");
  }
  callback();
}

现在记录：第一，第二，第三

互联网上有很多关于此的资源，我过去常常理解这一点：this one

每个循环外的jQuery访问变量

3 个答案: