Javascript jQuery，如果不是'；行不通

我正在使用.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);
    }
});

$.ajax({
类型：“POST”，
url:“submit.php”，
数据：数据，
cache:false，
beforeSend:function（）{
if（！$.trim（$（“#cat”）.val（））{
$（“.fb错误”）.css（“显示”、“块”）；
$（“.fb error”）.html（“cat字段为空”
”；
xhr.abort（）；
}
else if（！$.trim（$（“#box”）.val（））{
$（“.fb错误”）.css（“显示”、“块”）；
$（“.fb error”）.html（“框字段为空”
”；
xhr.abort（）；
}
},
成功：函数（html）{
$（'textarea#box'）.val（''）；
$（“#包装盒”）.prepend（html）；
}
});

如果要同时检查这两个条件，则不能使用

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();
}

var错误=“”；
if（！$.trim（$（“#cat”）.val（））{
error=“cat字段为空”
”；
}
if（！$.trim（$（“#box”）.val（））{
错误+=“框字段为空”
”；
}
如果（错误）{
$（“.fb error”）.html（错误）；
$（“.fb错误”）.css（“显示”、“块”）；
xhr.abort（）；
}

---

在第二个

if

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

对每个条件使用单独的

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);
},

beforeSend:function（）{
var msg=''；
if（！$.trim（$（“#cat”）.val（））{
$（“.fb错误”）.css（“显示”、“块”）；
msg=“cat字段为空
”；
xhr.abort（）；
}
if（！$.trim（$（“#box”）.val（））{
$（“.fb错误”）.css（“显示”、“块”）；
msg+=“框字段为空
”；
xhr.abort（）；
}
$（“.fb error”）.html（msg）；
},

要调试，能否切换“盒子”和“猫”

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

将#框更改为您知道不存在（也不可能存在）的内容。也许这里面有价值

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

console.log（$.trim（$（“#cat”）.val（）=”+$.trim（$（“#cat”）.val（））； console.log（$.trim（$（“#box”）.val（）=”+$.trim（$（“#box”）.val（））；

合并：

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" );
}

var错误=false；
if（！$.trim（$（“#cat”）.val（））{
$（“.fb error”）.append（“cat字段为空”
”；
错误=真；
}
if（！$.trim（$（“#box”）.val（））{
$（“.fb error”）.append（框字段为空）；
错误=真；
}
如果（错误）{
xhr.abort（）；
$（“.fb错误”）.css（“显示”、“块”）；
}

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

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();
}

var errors=[]；
if（！$.trim（$（“#cat”）.val（））{
错误。按（“cat字段为空”
”；
}
if（！$.trim（$（“#box”）.val（））{
错误。按（“框字段为空”
”；
}
if（errors.length）{
$（“.fb error”）.css（“display”、“block”）.html（errors.join（“”））；
xhr.abort（）；
}

删除之间的空格{and else if？如果希望同时显示这两条消息，则不应使用

else

if

，而应将消息附加到元素中，而不是将其覆盖。@Mark，因为在Javascript中，空格何时起作用？没有任何帮助。@Frederic，但我想运行这两个检查并有两个不同的根据错误租用消息，你有什么建议？我不知道你要他做什么来修复代码。我个人会从

html（）

切换到

$（“.fb error”）。追加（MESSAGE
）

对于每个已验证的字段谢谢！我真的很喜欢这种方法。您甚至可以过火地将验证存储在一个数组中：

var validations=[{selector:'#cat'，message:'cat字段为空'}，{selector:'#box'，message:'box字段为空'}]；for（var k in validations）if（！$.trim（validations[key].selector）.val（））//等等。

但它最终会变成更多的代码。