Question

我有一些代码如下：

$(document).on('click', '.set_up_btn', function(){
var menu_name=$('.menu_name').val();
var menu_type=$('.menu_type_sel').val();
var rest_id=$('body').data('rest_id');
var error=false;

if(menu_name=="")
{
    $('.error_box13').eq(0).html("<p>Enter Identifier for this Menu</p>");
    $('.error_box13').eq(0).show(300);
    error=true;
}
if(menu_type=="0")
{
    $('.error_box13').eq(1).html("<p>Select Menu Type</p>");
    $('.error_box13').eq(1).show(300);
    error=true;
}
if(error==true)
{
    return;
}
//check menu name is unique
var data="rest_id="+rest_id+"&name="+menu_name;

$.ajax({
    type:"POST",
    url:"includes/check_menu_name.php",
    data:data,
    success:function(html){
        if(html==1)
        {
            //menu name is duplicate
            $('.error_box13').eq(0).html("<p>Menu Name already in use.</p>");
            $('.error_box13').eq(0).show(300);
            error=true;
        }
        else if(html==2)
        {
            //menu name is ok

        }
    return error;
    }
});//end ajax
if(error==true)
{
    e.stopImmediatePropagation();
    return false;
}

var data2="rest_id="+rest_id+"&name="+menu_name+"&menu_type="+menu_type;

$.ajax({
    type:"POST",
    url:"includes/set_menu.php",
    data:data2,
    success:function(html2){
        if(html2==1)
        {
            var app="";
            if(menu_type==1)
            {
                menu_type="Bar Menu";
            }
            if(menu_type==2)
            {
                menu_type="Food Menu";
            }
            app+="<h2 class='menu_header'>"+menu_type+"</h2><hr />";
            app+="<h2 class='menu_title'>"+menu_name+"</h2>";
            $(app).appendTo($('.third').eq(2));
        }
        else
        {
            alert("ERROR: Could not write to database. Please try again.");
        }
    }
});//end ajax

});

如果第一个ajax请求返回'1'，我需要做的是退出整个'click'函数 - 菜单名已经被用于此用户。

目前，如果发生这种情况，javascript会继续运行第二个ajax请求并将数据写入数据库。

Answer 1

您遇到此问题是因为成功函数在请求返回时“稍后”调用。它不是瞬时的，因此错误变量尚未填充。处理成功函数内的错误如下：

$.ajax({
    type:"POST",
    url:"includes/check_menu_name.php",
    data:data,
    success:function(html){
        if(html==1)
        {
            //menu name is duplicate
            $('.error_box13').eq(0).html("<p>Menu Name already in use.</p>");
            $('.error_box13').eq(0).show(300);
            error=true;


            // we must handle the error here!


            handleError(e, error);
        }
        else if(html==2)
        {
            //menu name is ok



            // continue on as normal
            continueNoError();
        }
    return error;
    }
});//end ajax

// Code run here runs BEFORE $.ajax returns


function handleError(e, error) {
    if(error==true)
    {
        e.stopImmediatePropagation();
        return false;
    }
}

function continueNoError() {
    // Put what to after the first ajax call here
}

Answer 2

目前，无论发生什么，第二次AJAX调用都会运行。

将其包裹在您满足要求时调用的点击内的方法中。

即：

if (menu_type === 2) {
    menu_type="Food Menu";
    setMenu();
}

然后：

var setMenu = function () {
    $.ajax({
        // do stuff
    });
}

退出嵌入在另一个函数中的javascript函数

2 个答案: