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

时间:2017-03-11 02:21:41

标签: php ajax webpack

我试图使用AJAX提交联系表单。到目前为止已完成了数百次,但之前从未使用过webpack。

我的index.js文件

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

当我运行webpack时,我收到以下错误消息:

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

我不知道问题是什么。 mailtest.php在我的src目录中。我想知道为什么我不能硬编码这样的东西并将.php文件推送到我的服务器,真的很令人沮丧。

任何帮助表示赞赏!

1 个答案:

答案 0 :(得分:0)

它与文件名无关或是否存在。问题是您使用的代码不是有效的JavaScript。你甚至无法运行它,当它被webpack解析时它会失败。

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

您要做的是将该函数作为另一个参数传递给.on函数,但是您在'#btn-submit-modal'之后关闭了括号,因此最后一行的括号是不匹配的,因此无效。正确的代码是:

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