在PHP中如何实现这一点？表单输入，然后函数，然后在div中输出，而不刷新页面？_Php

在PHP中如何实现这一点？表单输入，然后函数，然后在div中输出，而不刷新页面？

php

在PHP中如何实现这一点？表单输入，然后函数，然后在div中输出，而不刷新页面？,php,Php,index.php <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Form submit in php without refresh?</title> <script src="http://ajax.googleapis.com/ajax/libs/

index.php

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Form submit in php without refresh?</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript">
function processForm() { 
        $.ajax( {
            url: process.php,
            data: 'how to get everything from process.php echos?',
            success: function(data) {
                $('#calc').html(data);
            }
        } );
}
</script>

</head>
<body>
    <form id="form" method="post" action="" onsubmit="processForm();return false;">
        <input type="text" id="total" name="total" value="" />
        <input type="submit" value="Submit" id="submitButton" />
    </form>
<div id="calc">
</div>
</body>
</html>

<?php
$number = $_POST['total'];
//this should be $number = "the number entered in the 'total' field in the form";

echo $d = ceil(log(2*$number)/log(3))," tiers<br />\n";
$x = 1;
for($i = 1; $i<$d;$i++){
    echo "tier " . $i . "<br />\n";
    echo str_repeat('o', $x),"<br />\n";
    $number -= $x;
    $x *= 3;
}
echo "tier " . $i . "<br />\n";
echo str_repeat('o', $number),"<br />\n";
//all of the above echos should go into the 'calc' div in html, without page refresh
?>


在php中提交表单而不刷新？
函数processForm（）{
$.ajax（{
url:process.php，
数据：“如何从process.php echos获取所有内容？”，
成功：功能（数据）{
$（'#calc'）.html（数据）；
}
} );
}

process.php

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Form submit in php without refresh?</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript">
function processForm() { 
        $.ajax( {
            url: process.php,
            data: 'how to get everything from process.php echos?',
            success: function(data) {
                $('#calc').html(data);
            }
        } );
}
</script>

</head>
<body>
    <form id="form" method="post" action="" onsubmit="processForm();return false;">
        <input type="text" id="total" name="total" value="" />
        <input type="submit" value="Submit" id="submitButton" />
    </form>
<div id="calc">
</div>
</body>
</html>

<?php
$number = $_POST['total'];
//this should be $number = "the number entered in the 'total' field in the form";

echo $d = ceil(log(2*$number)/log(3))," tiers<br />\n";
$x = 1;
for($i = 1; $i<$d;$i++){
    echo "tier " . $i . "<br />\n";
    echo str_repeat('o', $x),"<br />\n";
    $number -= $x;
    $x *= 3;
}
echo "tier " . $i . "<br />\n";
echo str_repeat('o', $number),"<br />\n";
//all of the above echos should go into the 'calc' div in html, without page refresh
?>

您需要执行AJAX调用，而不是实际执行HTTP POST。这是在JavaScript中完成的。然后挂起返回钩子上的代码，将内容放入div中
使之比手动操作更容易。
这里要介绍两件事
1）检索POST数据。
您可以从$\u post数组访问post数据，因此在您的情况下，您可以执行$number=$\u post['total']
2）Ajax调用
下面是一个关于使用jQuery提交表单而不重定向的好教程：

这里是jQuery Ajax方法的API：
您需要JavaScript。@迈克·刘易斯：谢谢。我已尝试更新代码。我仍然不确定如何从process.php获取echo，然后通过ajax将其作为“数据”插入到div中<代码>数据：“如何从process.php echos获取所有内容？”，
。我的代码中的所有内容都正常吗？除了您没有将类型作为数据传入之外，其他内容看起来都很好，因此不会定义$\u POST['type'.@Mike Lewis:所以我删除了行type:'POST'，
，因为我没有传入类型。。只是数据。。但是如何使用data=
从process.php传入特定数据呢？例如，如果要执行数据：“name=John&location=Boston”，则可以在进程中访问$\u POST['name']和$\u POST['location']。php@Mike刘易斯：对不起，刚才我注意到了。尝试了data:“total=“+document.getElementById（'total'）。value，
并使用$number=$\u POST['total']
in process.php。还是不行。对不起，JS让我很痛苦。谢谢。我已尝试更新代码。我仍然不确定如何从process.php获取echo，然后通过ajax将其作为“数据”插入到div中<代码>数据：“如何从process.php echos获取所有内容？”，

。我的代码中的所有内容都正常吗？您需要检索所有要发送的字段，并将它们放入

.ajax

调用中的

数据：

元素中。（同时将页面名称放在

url:

的引号中。）很好！谢谢-但是，它输出

-INF第1层。在process.php中，我有$number=$\u POST['total']$number=totalfieldin格式？