douhuai2015
douhuai2015
2017-03-11 02:21

尝试提交AJAX表单时出现Webpack错误

已采纳

I'm trying to submit a contact form using AJAX. Done this hundreds of times so far but never used webpack before.

My index.js file

$document.on('click', '#btn-submit-modal'), function(event){
  event.preventDefault();
  $.post("mailtest.php", $("#contactform").serialize());
});

When I run webpack I get the following error message:

ERROR in ./src/js/index.js
Module parse failed:     
..../index.js Unexpected token (24:1) //changed path for readability
You may need an appropriate loader to handle this file type.
|
|   $.post("mailtest.php", $("#contactform").serialize());
| });
|
 @ ./src/app.js 2:16-40
 @ multi (webpack)-dev-server/client?http://localhost:8081 ./src/app.js

I have no clue what's the problem. mailtest.php is in my src directory. I wonder why I can't just hardcode something like this and push the .php file to my server, really frustrating.

Any help appreciated!

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

1条回答

  • doufangxie0203 doufangxie0203 4年前

    It has nothing to do with file name or whether it's present. The problem is that the code you're using is not valid JavaScript. You don't even get to run it, it fails when it gets parsed by webpack.

    $document.on('click', '#btn-submit-modal'), function(event){
  event.preventDefault();
  $.post("mailtest.php", $("#contactform").serialize());
});
 ^
Unexpected parenthesis

    What you wanted to do is pass the function as another parameter to the .on function, but you closed the parenthesis after '#btn-submit-modal', so the parenthesis on the last line is unmatched and therefore invalid. The correct code would be:

    $document.on('click', '#btn-submit-modal', function(event){
  event.preventDefault();
  $.post("mailtest.php", $("#contactform").serialize());
});
    点赞 评论 复制链接分享
提交

为你推荐