Javascript 在不使用submit按钮重新加载的情况下将表单提交到PHP页面

您好，朋友们，我是jquery和javascript新手，因此我将要发送表单的代码复制到了php页面，而无需重新加载页面。此代码可以工作，但我希望单击提交按钮发送表单，而不是按enter键：

<input type="text" id="name" name="name"  /><br><br>
<input type="text" id="job" name="job" /><br><br>
<input type="submit" id="submit" />

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#name').focus();
        $('#name').keypress(function(event) {
            var key = (event.keyCode ? event.keyCode : event.which);
            if (key == 13) {
                var info = $('#name').val();
                $.ajax({
                    method: "POST",
                    url: "fell.php",
                    data: {
                        name: $('#name').val(),
                        job: $('#job').val()
                    },
                    success: function(status) {
                    }
                });
            };
        });
    });
</script>

$（文档）.ready（函数（）{
$（'#name'）.focus（）；
$（'#name'）。按键（函数（事件）{
var key=（event.keyCode？event.keyCode:event.which）；
如果（键==13）{
var info=$（'#name'）.val（）；
$.ajax({
方法：“张贴”，
url:“fall.php”，
数据：{
名称：$（'#name'）.val（），
作业：$（“#作业”）.val（）
},
成功：功能（状态）{
}
});
};
});
});

要使“提交”按钮的点击生效，您应该将代码包装在

表单

元素中，然后将JS代码更改为挂接到该表单的

提交

事件。请注意，默认情况下，它还将为您提供“输入按键时提交”操作，因此可以删除当前的按键处理程序。试试这个：

<form id="my-form">
    <input type="text" id="name" name="name"  /><br><br>
    <input type="text" id="job" name="job" /><br><br>
    <input type="submit" id="submit" />
</form>

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#name').focus();
        $('#my-form').submit(function(e) {
            e.preventDefault();
            $.ajax({
                method: "POST",
                url: "fell.php",
                data: $(this).serialize(),
                success: function(status) {
                    console.log('AJAX call successful');
                    console.log(status);
                }
            });
        });
    });
</script>

$（文档）.ready（函数（）{
$（'#name'）.focus（）；
$（“#我的表格”）。提交（函数（e）{
e、 预防默认值（）；
$.ajax({
方法：“张贴”，
url:“fall.php”，
数据：$（this）.serialize（），
成功：功能（状态）{
log（'AJAX调用成功'）；
控制台日志（状态）；
}
});
});
});

您不能指定提交按钮的名称。尝试指定“提交”按钮的名称，然后尝试以下操作：-






$（文档）.ready（函数（）{
$（'#name'）.focus（）；
});
函数submitForm（）{
$.ajax({
方法：“张贴”，
url:“fall.php”，
数据：$（“#myFrom”）.serialize（），
成功：功能（状态）{
警报（“成功”）；
}
});
返回false；
}

您是否尝试过$（'#name'）.keypress（函数（事件）{event.preventDefault（）}），那么您为什么认为它没有提交？它没有插入到我的database@KingKanayoAustinLengend这个答案应该有效，问题是你的PHP，似乎你在寻找未设置的

if（isset（$\u POST['submit']）

。尝试将

name=“submit”

添加到submit按钮。此外，如果您正是通过这种方式将记录插入mysql数据库，则会受到SQL注入攻击。在*属性上使用

是非常过时的。您应该使用不引人注目的JS来附加事件。
You are not name the submit button. Try to give name to submit button and try below:-
<form id="myFrom" onsubmit="submitForm();">
    <input type="text" id="name" name="name"  /><br><br>
    <input type="text" id="job" name="job" /><br><br>
    <input type="submit" id="submit" name="submit" />
</form>

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#name').focus();
    });
    function submitForm(){
        $.ajax({
            method: "POST",
            url: "fell.php",
            data: $("#myFrom").serialize(),
            success: function(status) {
                alert("successfull");
            }
        });
        return false;
    }
</script>