Question

我有一个表单提交给我编写并在几个项目中使用的jQuery插件，我正在尝试扩展其功能。直到现在我还没有遇到任何问题，当时我决定在表单中添加可选字段。我的表单上的所有输入文本字段都是通过另一个带有简要说明的jQuery函数预先填充的，当字段获得焦点并且用户开始输入时，这些指令会消失。

问题是，如果用户没有输入自己的值，则可选输入会发布预先填充的值，在这种情况下，我的jQuery插件会在参数列表后返回“缺失”错误。如果用户填写所有字段，则不会出现错误。

以下是我正在使用的代码：

$(document).ready(function(){
    $("#contact-submit").click(function(){
        var valid = '';
        var isr = ' is required.';
        var fname = $("#cfname").val();
        var company = $("#ccompany").val();
        var email = $("#cemail").val();
        var phone = $("#cphone").val();
        var location = $("#clocation").val();
        var website = $("#cwebsite").val();
        var design = $("#cdesign:checked").val();
        var security = $("#csecurity:checked").val();
        var social = $("#csocial:checked").val();
        var seo = $("#cseo:checked").val();
        var video = $("#cvideo:checked").val();
        var presence = $("#cpresence:checked").val();
        var customers = $("#ccustomers:checked").val();
        var showcase = $("#cshowcase:checked").val();
        var campaign = $("#ccampaign:checked").val();
        var ecommerce = $("#cecommerce:checked").val();
        var digital = $("#cdigital:checked").val();
        var sec = $("#csec:checked").val();
        var vid = $("#cvid:checked").val();
        var gseo = $("#cgseo:checked").val();
        var other = $("#cother:checked").val();
        var budget = $("#cbudget").val();
        var time = $("#ctime").val();
        var os = $("#cos").val();
        var comment = $("#ccomment").val();
        if (!email.match(/^([a-z0-9._-]+@[a-z0-9._-]+\.[a-z]{2,4}$)/i)) {
            valid += '<br />A valid Email'+isr;
        }
        if (fname.length<1) {
            valid += '<br />Your name'+isr;
        }
        if (phone.length<13) {
            valid += '<br />A 10-digit phone number of the format (xxx)xxx-xxxx'+isr;
        }
        if (phone.length>13) {
            valid += '<br />A 10-digit phone number of the format (xxx)xxx-xxxx'+isr;
        }
        if (valid!='') {
            $("#contact-message").fadeIn("slow");
            $("#contact-message").html("Error:"+valid);
        }
        else {
            var datastr ='fname=' + fname + '&company=' + company + '&email=' + email + '&phone=' + phone + '&location=' + location + '&website=' + website + '&design=' + design + '&security=' + security + '&social=' + social + '&seo=' + seo + '&video=' + video + '&presence=' + presence + '&customers=' + customers + '&showcase=' + showcase + '&campaign=' + campaign + '&ecommerce=' + ecommerce + '&digital=' + digital + '&sec=' + sec + '&vid=' + vid + '&gseo=' + gseo + '&other=' + other + '&budget=' + budget + '&time=' + time + '&os=' + os + '&comment=' + comment;
            $("#contact-message").css("display", "block");
            $("#contact-message").html("Submitting...");
            $("#contact-message").fadeIn("slow");
            setTimeout("send('"+datastr+"')",2000);
        }
        return false;
    });
});
function send(datastr){
    $.ajax({    
        type: "POST",
        url: "plugins/hm_custom/mail-consult.php",
        data: datastr,
        cache: false,
        success: function(html){
        $("#contact-message").fadeIn("slow");
        $("#contact-message").html(html);
        setTimeout('$("#contact-message").fadeOut("slow")',2000);
    }
    });
}

更令人困惑的是，如果我将输入数量减少回原来的六个文本字段，即使我无法在可选字段中插入文本，也不会抛出任何错误。我确信我的代码比以前复杂得多，这是一项正在进行的工作，我正在慢慢学习如何一点一点地压缩它。我必须认为我的问题必须是有条件地跳过的语法错误，但我对Javascript和jQuery很新，所以我不知道。

有什么想法吗？

Answer 1

我认为你的问题就是这一行：

setTimeout("send('"+datastr+"')",2000);

您正在构建一个定义函数名称的字符串，并且通过添加dataStr，您构建的名称无效。

如果您使用闭包而不是硬编码字符串，这应该可以解决问题：

setTimeout(function() { send(dataStr); },2000);

如果没有填写可选输入，jQuery表单会在参数列表“错误之后”抛出“错误”

1 个答案: