0

我正在使用 .ajax 将数据发送到我的数据库。我有两个领域。我想检查其中一个是否为空，如果是则显示错误。第一个 if 工作正常。该消息显示，但 else if 不显示。我的问题可能是什么？我对javascript和iquery不太熟悉。

$.ajax({
    type: "POST",
    url: "submit.php",
    data: data,
    cache: false,
     beforeSend: function() {
        if (!$.trim($("#cat").val())) {
            $(".fb-error").css( "display", "block" );
            $(".fb-error").html("<p>the cat field is empty</p>");
            xhr.abort();
        }

        else if (!$.trim($("#box").val())) {
            $(".fb-error").css( "display", "block" );
            $(".fb-error").html("<p>the box field is empty</p>");
            xhr.abort();
        }
    },
    success: function(html){
        $('textarea#box').val('');
        $("#box-wrap").prepend(html);
    }
});
4

5 回答 5

4

else如果您想同时检查这两个条件，则不能使用。

var error = '';

if (!$.trim($("#cat").val())) {
        error = "<p>the cat field is empty</p>";
}

if (!$.trim($("#box").val())) {
        error += "<p>the box field is empty</p>";
}

if (error) {
        $(".fb-error").html(error);
        $(".fb-error").css( "display", "block" );
        xhr.abort();
}

其次if，您必须附加新的 html，以防止覆盖已添加的消息。

于 2013-10-29T13:54:43.963 回答
2

对每个条件使用单独if的语句；else if仅在第一次if失败时运行。使用变量来累积消息。

 beforeSend: function() {
    var msg = '';
    if (!$.trim($("#cat").val())) {
        $(".fb-error").css( "display", "block" );
        msg = "<p>the cat field is empty</p>";
        xhr.abort();
    }
    if (!$.trim($("#box").val())) {
        $(".fb-error").css( "display", "block" );
        msg += "<p>the box field is empty</p>";
        xhr.abort();
    }
    $(".fb-error").html(msg);
},
于 2013-10-29T13:55:31.297 回答
2

我会将错误放在一个数组中，如果它不为空则显示它们

var errors = [];
if (!$.trim($("#cat").val())) {
    errors.push("<p>the cat field is empty</p>");
}

if (!$.trim($("#box").val())) {
    errors.push("<p>the box field is empty</p>");
}

if(errors.length){
    $(".fb-error").css( "display", "block" ).html(errors.join(''));
    xhr.abort();
}
于 2013-10-29T14:02:52.160 回答
1

巩固：

var error = false;
if (!$.trim($("#cat").val())) {
        $(".fb-error").append("<p>the cat field is empty</p>");
        error = true;
}

if (!$.trim($("#box").val())) {
        $(".fb-error").append("<p>the box field is empty</p>");
        error = true;
}

if (error) {
        xhr.abort();
        $(".fb-error").css( "display", "block" );
}
于 2013-10-29T13:59:10.333 回答
-2

调试时可以切换#box 和#cat 吗？

您使用的是 else，因此如果 #cat 为空，您将不会看到消息“框字段为空”。仅当#cat 不为空且#box 为空时才会显示此消息。

将#box 更改为您知道不存在（并且不能存在）的内容。也许它有一个价值。

您可以将#cat 和#box 的值输出到控制台以确保它们为空。

console.log("$.trim($("#cat").val()="+$.trim($("#cat").val()); console.log("$.trim($ ("#box").val()="+$.trim($("#box").val());

于 2013-10-29T13:57:08.760 回答