Javascript jqueryajax试图让它工作

我试图让这个ajax在第一个按钮上运行，在第二个按钮上，我只是想看看我是否至少点击了jquery，但由于某种原因，这并没有发生，我的代码如下

<form id="postform" >
                 <input class="btn btn-lg" style="border: 1px solid gray;" name="email" id="email" type="email" placeholder="Enter Your Email" required> &nbsp
                 <button class="btn btn-info btn-lg" id="emailbutton" onsubmit="submitting()" type="submit">Submit</button>
                 <input class="btn btn-info btn-lg" type="submit" id="#inputbutton" value="Shooter" ></input>
             </form>
             <script>
             (function ($) {
                 function submitting(e) 
                 {
                    e.preventDeafault();
                     $('#emailbutton').on('submit', (function () {
                         alert("Clicked");
                         $.ajax
                         ({
                             type: 'POST',
                             url: 'bootstrap/php/form.php',
                             data: $(this).serialize(),
                             success: function (result) {
                                 console.log(result);
                                 $('#postform').html(result);
                             }
                         });
                     }));
                 }

                 function subshooter() {
                 $('#inputbutton').click(function() { alert('testbutton clicked'); });
                 }

             });
             </script>

 
提交
（函数（$）{
功能提交（e）
{
e、 防止错误（）；
$（'#emailbutton'）。在（'submit'，（函数（）{
警报（“点击”）；
$.ajax
({
键入：“POST”，
url:'bootstrap/php/form.php'，
数据：$（this）.serialize（），
成功：功能（结果）{
控制台日志（结果）；
$（'#postform'）.html（结果）；
}
});
}));
}
函数subshooter（）{
$（'#inputbutton'）。单击（函数（）{alert（'testbutton clicked'）；}）；
}
});

---

我的主要目标是让ajax工作，这样当人们在表单上提交他们的电子邮件地址时，产生的ajax将处理一个php文件，html将更改为类似“谢谢”的内容，而不会刷新整个页面。

当调用

提交

时，它会在按钮上附加一个单击事件，但该事件已经发生，因此在再次单击Submit按钮之前不会再次调用该事件

同样，

preventedaFault

拼写错误，很可能导致执行停止

另一个问题是您没有将事件传递给提交，因此

e

将是未定义的

由于您使用的是jQuery，因此应该使用jQuery附加事件，这将使您能够访问事件和

preventDefault

函数：

$('form').submit( function (e) {
  e.preventDefault();
});

---

您应使用以下代码：

                         <script>

                        (function ($) {


                         $('#inputbutton').click(function() { 
                         alert('testbutton clicked'); });

                     });

                         function submitting(e) 
                         {
                            e.preventDefault();
                             $('#emailbutton').on('submit', (function () {
                                 alert("Clicked");
                                 $.ajax
                                 ({
                                     type: 'POST',
                                     url: 'bootstrap/php/form.php',
                                     data: $(this).serialize(),
                                     success: function (result) {
                                         console.log(result);
                                         $('#postform').html(result);
                                     }
                                 });
                             }));
                         }
                         </script>

（函数（$）{
$（'#inputbutton'）。单击（函数（）{
警报（'testbutton clicked'）；}）；
});
功能提交（e）
{
e、 预防默认值（）；
$（'#emailbutton'）。在（'submit'，（函数（）{
警报（“点击”）；
$.ajax
({
键入：“POST”，
url:'bootstrap/php/form.php'，
数据：$（this）.serialize（），
成功：功能（结果）{
控制台日志（结果）；
$（'#postform'）.html（结果）；
}
});
}));
}

你犯的错误：

防止默认的函数是

e.preventDefault（）

在jquery中，应该将单击事件绑定到页面加载时的按钮

由于
提交（e）
是一个函数，它应该在onbody加载事件之外，即
document.ready（{…}）
函数。
修改的Html

<form id="postform" >
                 <input class="btn btn-lg" style="border: 1px solid gray;" name="email" id="email" type="email" placeholder="Enter Your Email" required> &nbsp
                 <button class="btn btn-info btn-lg" id="emailbutton"  type="submit">Submit</button>
                 <input class="btn btn-info btn-lg" type="submit" id="inputbutton" value="Shooter" ></input>
             </form>


 
提交

您的脚本有太多错误，这就是它失败的原因。。。以后一定要检查浏览器控制台

更正js:

<script src="https://code.jquery.com/jquery-1.10.2.js" ></script>
<script>
$(document).ready(function (){
                 $('#inputbutton').on('click',function() { alert('testbutton clicked'); });
                 $('#postform').on('submit',function(e){
                            e.preventDefault();
                            alert("Clicked");
                            $.ajax({
                                     type: 'POST',
                                     url: "bootstrap/php/form.php",
                                     data: $(this).serialize(),
                                     success: function (result) {
                                         console.log(result);
                                          alert("success");
                                         $('#postform').html(result);
                                     },
                                     error: function (){
                                        alert("Unable To post");
                                     }
                                 }); 
                    });
});
             </script>


$（文档）.ready（函数（）{
$（'#inputbutton'）。on（'click'，function（）{alert（'testbutton clicked'）；}）；
$（'#postform'）。关于（'submit'，函数（e）{
e、 预防默认值（）；
警报（“点击”）；
$.ajax({
键入：“POST”，
url:“bootstrap/php/form.php”，
数据：$（this）.serialize（），
成功：功能（结果）{
控制台日志（结果）；
警惕（“成功”）；
$（'#postform'）.html（结果）；
},
错误：函数（）{
警报（“无法发布”）；
}
}); 
});
});
请注意，正确的方法名称是
preventDefault（）
，并且您似乎没有在任何地方调用
subshooter（）
？我更改了拼写，但仍然没有帮助Philvarg我尝试了您建议的编辑，但它仍然没有影响到函数，我对此束手无策，谢谢各位，对代码进行了更正后，它仍然告诉我“$”未定义，原因是我首先编写了函数，并在文档底部加载了jQuery文件。谢谢。全身负荷？我认为（函数（$）…）是document.ready函数是document.ready的缩写，但它是一个在加载web文档正文时调用的事件。谢谢，我在google chrome的开发者工具中使用了控制台，但控制台中没有显示任何错误。你能解释一下我代码中的错误在哪里吗$（“#emailbutton”）。在（'submit'上，而不是这个，你应该使用$（'#emailbutton'）。在（'click'或直接$（'#postform'）。在（'submit'上，还有一件事不要将id命名为“#something”，你做了这个id=”#inpu