Javascript JQUERY+；PHP+；AJAX不起作用

我正在用html开发一个简单的程序，它使用php脚本将数据插入MySQL数据库。 但每次我按下保存按钮，它都会将我重定向到php页面。 我已经创建了Javascript文件，但它不适合我。 请帮忙

HTML文件（index.HTML）

---

我猜这是因为

$（“#myForm”）.attr（“action”）

返回一个相对URL。请尝试使用

$（#myForm”）.prop（“操作”）

。 不要包含两个jQuery库。把旧的拿走。可能会导致其他问题

//编辑： 在js文件中需要一个支持文档的函数。将内容替换为以下内容：

$( document ).ready(function() {
    $("#sub").click( function() {
        $.post( $("#myForm").attr("action"),
                 $("#myForm :input").serializeArray(),
                 function(info){ $("#result").html(info);
           });
        clearInput();
    });

    $("#myForm").submit( function() {
      return false;
    });

});

function clearInput() {
    $("#myForm :input").each( function() {
       $(this).val('');
    });
}

替换

$("#myForm :input").serializeArray(),

与

因为此方法“将一组表单元素编码为名称和值的数组。”

$（“#myForm”）.submit（函数（e）{
/*防止默认表单提交*/
e、 预防默认值（）；
变量形式=$（此）；
$.post（form.attr（“action”）、form.serializeArray（）、函数（info）{
$（“#结果”）.html（信息）；
/*将表单字段重置为默认值*/
form.reset（）；
});  
});

名称：

电子邮件：

域：

角色：

拯救
首先

$name=$_POST['name'];
$domain=$_POST['domain'];
$email=$_POST['email'];
$role=$_POST['role'];
$sql = "INSERT INTO user20015 VALUES ('$name', '$domain', '$email', '$role')";
        if(mysql_query($sql))

检测到SQL注入。为了绑定参数并避免有史以来最大的错误之一，请使用PDO将其删除

对于您的问题，请尝试绑定文档上的事件

$(document).on('submit', '#myForm', function() { return false; });

这是一个更好的实践，避免了一些“未加载html上的绑定”问题，这可能是您的问题

对于单击事件，您也可以这样做：

$(document).on('click', '#sub', function() {
 $.post( $("#myForm").attr("action"),
         $("#myForm :input").serializeArray(),
         function(info){ $("#result").html(info);
   });
clearInput();
});

试试这个：

    $(function(){//dom has loaded
 $("button#sub").click( function(e) {
    e.preventDefault(); /// prevent the default click event
     $.post( $("#myForm").attr("action"),
             $("#myForm").serializeArray(),
             function(info){ $("#result").html(info);
             clearInput();//clear the data AFTER the ajax was triggered
       });

    });

    function clearInput() {
        $("#myForm input").each( function() {
           $(this).val('');
        });
    }

});

我在浏览器中启用了javascript。为什么有两个jquery库？为什么没有元素？您需要在正文末尾包含脚本（添加标记后）和/或使用文档就绪处理程序。我也尝试了正文，但它不起作用，我认为1.8.1可能不起作用，所以添加了一个。您应该小心使用SQL语句。您可以像这样使用准备好的语句（查看w3schools教程）：我通常使用Ajax处理这些事件，在Ajax中输出一些关于成功或错误的数据。让我的生活轻松了一点。如果您感兴趣，可以在这里查看Ajax API：这也会提供相同的输出。它将我重定向到另一个页面它在提交后将您重定向到demo_insert.php，对吗？您可以分享您在JSFIDLE或其他地方使用的代码（JS+HTML）吗？让我们看看。您是否有$（document）.ready（function（）{/*code HERE*/}）；围绕javascript文件的内容包装？您的jQuery代码没有执行。不，我应该把这个函数放在哪里，我应该填写什么内容？将它放在js文件的开头，并将其中的所有内容放在这里的/*代码中*/place。有关文档就绪函数的进一步阅读：with$（document）.on（'submit'，'#myForm'，function（）{return false；}）；当我点击submit按钮时，它不会执行任何操作Yes，因为它成功地停止了提交传播，所以我们很好。现在，只需将相同的逻辑应用于单击事件，一切都应该很好。让他使用jQuery的文档就绪功能，这样他就可以像他在最初的帖子中那样绑定所有事件…@SimonKraus坏主意。文档上的绑定事件更可靠，因为只要$document.ready应用，文档就可以使用。然后，即使在绑定之后添加了内容，它也可以工作$document.ready应该只用于启动javascript，而javascript只能在文档加载（ajax等）时执行，不能绑定事件。你们能告诉我，在这段时间里我应该放什么吗？当我现在感到困惑的时候…同样的问题它重定向到php页面，您删除了
$（“#myForm”）.submit（function（）{return false；}）？
$name=$_POST['name'];
$domain=$_POST['domain'];
$email=$_POST['email'];
$role=$_POST['role'];
$sql = "INSERT INTO user20015 VALUES ('$name', '$domain', '$email', '$role')";
        if(mysql_query($sql))

$(document).on('submit', '#myForm', function() { return false; });

$(document).on('click', '#sub', function() {
 $.post( $("#myForm").attr("action"),
         $("#myForm :input").serializeArray(),
         function(info){ $("#result").html(info);
   });
clearInput();
});

    $(function(){//dom has loaded
 $("button#sub").click( function(e) {
    e.preventDefault(); /// prevent the default click event
     $.post( $("#myForm").attr("action"),
             $("#myForm").serializeArray(),
             function(info){ $("#result").html(info);
             clearInput();//clear the data AFTER the ajax was triggered
       });

    });

    function clearInput() {
        $("#myForm input").each( function() {
           $(this).val('');
        });
    }

});