Question

我在所有浏览器中收到此错误' jQuery SyntaxError：missing：after property id '，我不知道如何修复。我通过lint运行代码，我得到了同样的错误。违规行是代码：

$('#BA_boxform input:submit').on('click', function () {

由于我是jquery / js的新手，如果有人能告诉我哪里出错了，我将不胜感激。感谢

jquery代码

// function to connect to php and process form values

$(function(){
        $("#BA_boxform").validate({
        rules: {
            name: { required: true },
            lname: { required: true }
        },
        messages: {
            name: { required: "* required" },
            lname: { required: "* required" }
        },
        $('#BA_boxform input:submit').on('click', function () {

        var formdata = $('#BA_boxform').serialize() + '&submit=' + $(this).val();

         //alert(formdata);
         $.ajax({
           type: "POST",
           url: "/sample/admin/requests/boxes/boxesadd.php",
           data: formdata,
           dataType: 'json',
           success: function(msg){
               if(typeof msg.boxerrortext !== "undefined" && msg.boxerrortext == "You need to input a box")
                   {
                     $("#BA_addbox").html(msg.boxerrortext);
                   }
               else
                   {
                     $("#BA_addbox").html("You have successfully added box " + msg.box + " to the archive.");
                   }
               //$("#confirm_department").hide();

               /*
               var $dialog = $('<div id="dialog"></div>')
               .html('Your intake was successfully submitted and will be viewable in the reporting area.<br /><br />Thank you.');
               $dialog.dialog({
               autoOpen: true,
               modal: true,
               title: 'Box intake submission successfull',
               width: 400,
               height: 200,
               draggable: false,
               resizable: false,
               buttons: {
               Close: function() {
               $( this ).dialog( "close" );
               }
               }
               });
               */
               //alert(msg);
               //console.log(msg);
               //$("#BA_addbox").html(msg.box);

               //$("#formImage .col_1 li").show();
               //$("#BA_boxform").get(0).reset();
               //$("#boxaddform").hide();
          }
       });
         return false;
     });
   });
});

// end php processing
// End function to submit box intake form

Answer 1

我认为你的jquery应该是这样的：

侦听器$('#BA_boxform input:submit').on('click', function ()应独立于validate方法。

$(function () {
    $("#BA_boxform").validate({
        rules: {
            name: {
                required: true
            },
            lname: {
                required: true
            }
        },
        messages: {
            name: {
                required: "* required"
            },
            lname: {
                required: "* required"
            }
        },
    });

    $('#BA_boxform input:submit').on('click', function () {

        var formdata = $('#BA_boxform').serialize() + '&submit=' + $(this).val();

        //alert(formdata);
        $.ajax({
            type: "POST",
            url: "/sample/admin/requests/boxes/boxesadd.php",
            data: formdata,
            dataType: 'json',
            success: function (msg) {
                if (typeof msg.boxerrortext !== "undefined" && msg.boxerrortext == "You need to input a box") {
                    $("#BA_addbox").html(msg.boxerrortext);
                } else {
                    $("#BA_addbox").html("You have successfully added box " + msg.box + " to the archive.");
                }
                //$("#confirm_department").hide();

                /*
               var $dialog = $('<div id="dialog"></div>')
               .html('Your intake was successfully submitted and will be viewable in the reporting area.<br /><br />Thank you.');
               $dialog.dialog({
               autoOpen: true,
               modal: true,
               title: 'Box intake submission successfull',
               width: 400,
               height: 200,
               draggable: false,
               resizable: false,
               buttons: {
               Close: function() {
               $( this ).dialog( "close" );
               }
               }
               });
               */
                //alert(msg);
                //console.log(msg);
                //$("#BA_addbox").html(msg.box);

                //$("#formImage .col_1 li").show();
                //$("#BA_boxform").get(0).reset();
                //$("#boxaddform").hide();
            }
        });
    });
});

还有一件事......你需要这样做，因为验证在表单上，你的监听器在提交按钮上，它不起作用：

$('#BA_boxform').on('submit', function ()

Answer 2

乍一看，您的$("#BA_boxform").validate()尚未关闭

Answer 3

问题是违规的代码行没有变量名。该函数在“选项”或属性列表中的逗号后传递。如果该方法应该作为事件处理程序传递，则需要执行以下操作：

//连接到php并处理表单值的函数

$(function(){
    $("#BA_boxform").validate({
    rules: {
        name: { required: true },
        lname: { required: true }
    },
    messages: {
        name: { required: "* required" },
        lname: { required: "* required" }
    },
    myEventHandler: $('#BA_boxform input:submit').on('click', function () {
// rest of code snippet you had

那就是说，我不确定那是你要做的。看起来您正在添加一个单击处理程序作为validate函数的选项的一部分。考虑到你正在调用一行代码并且没有传递方法处理程序，我猜你的意思是：

$(function(){
    $("#BA_boxform").validate({
    rules: {
        name: { required: true },
        lname: { required: true }
    },
    messages: {
        name: { required: "* required" },
        lname: { required: "* required" }
    }
   }); 
// Validate is ended

// now add your event handler
  $('#BA_boxform input:submit').on('click', function () {

// rest of code snippet you had

上面回答了原来的问题。我会尝试回答接受回答的评论中提出的刷新问题。我的大部分建议都是基于对未显示的html代码的一些假设。

好的 - 停止刷新有两个简单的选择 1.将提交按钮从<input type='submit'/>更改为<input type='button'/> 2.在点击处理程序上返回false（就像你正在做的那样）（上面我的评论中的错误）。

尝试＃2后仍然刷新的可能原因是javascript停止处理中的错误。将html中的输入类型更改为“按钮”而不是提交。然后删除jquery选择器中的submit并按类或id引用按钮$('#BA_boxform').find('.classOfYourButton').on('click', function () {。如果你没有点击返回虚假部分，这应该可以阻止任何意外发布。

除此之外，我不确定问题是什么。正如其他人所说，在纠正了验证方法的关闭之后，代码是正确的（虽然它没有做你想要的）。如果您将其与其他相关代码一起发布在新问题中，则更容易进行故障排除。

Answer 4

你确定你正确地写了选择器

var $dialog = $('<div id="dialog"></div>')

因为我认为它应该只是

var $dialog = $('#dialog')

或者如果要创建新元素，请改用append。

jQuery SyntaxError需要帮助修复

4 个答案: