Question

我知道这是一个重复的问题，但请帮助我。我有这个代码，使用ajax将表单数据发送到php，但代码不起作用，我不知道为什么。有什么帮助吗？

<html>
<head>
    <script src="http://code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script>

<script>
function chk(){
    var name = document.getElementById('name').value;
    var datastring = 'name = ' + name;
    $.ajax({
        type:"post",
        url:"hi.php",
        data: datastring,
        cache:false,
        success: function(html){
            $('msg').html(html);
        }
    });
    return false;
}

</script>
</head>
<body>

     <form>
       <input type="text" name="id" >
       <input type="submit" value="submit"  onclick="return chk()">

        </form>
<p id="msg"></p>
</body>
</html>

PHP

<?php
if($_POST)
{
$name=$_POST['name'];

echo $name."<br>";

}

?>

Answer 1

问题：当您使用此行时，您的代码正在寻找id name的元素：var name = document.getElementById('name').value;。但是，HTML中没有包含该ID的元素。此外，您正在触发id为msg的元素，但您没有告诉它是一个ID，因为不存在哈希#。

解决方案，因为您已经在使用jQuery，我会坚持使用其功能，特别是submit()和serialize()。像这样重做你的代码：

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script>
    </head>
    <body>
        <form>
            <input type="text" name="name">
            <input type="submit" value="submit">
        </form>
        <p id="msg"></p>
        <script>
            $('form').submit(function () {
                $.ajax({
                    type: "post",
                    url: "hi.php",
                    data: $(this).serialize,
                    cache: false,
                    success: function (html) {
                        $('#msg').html(html);
                    }
                });
                return false;
            });
        </script>
    </body>
</html>

Answer 2

这不会做任何事情：

$('msg').html(html);

因为标记中没有<msg>个标记。也许您打算使用id的{{1}}来引用元素？：

"msg"

Answer 3

在您的代码中，您将html响应设置为：$（＆＃39; msg＆＃39;）。html（html）; 我想你的意思是$('#msg').html(html);注意＆＃39;＃＆＃39;通过id引用元素。

使用ajax将表单数据发送到php

3 个答案: