我一直在审查很多 AJAX/PHP 文档,并向社区提出了一个简单的问题,以帮助我了解基础知识。下面是一个简单的表单,用户在其中提交一个值。它被发送到一个php计算器,该计算器对值进行平方并创建结果的一点回声。
我想学习如何在单击提交后简单地将 php 文件包含在div"目标"中。与其传回一个值,我想将 php 文件包含在div 中。
论坛让我走到了这一步。感谢那些可以查看并提供指导的人。
方形.html:
<!DOCTYPE html>
<html lang="en">
<head>
<title> AJAX Insert test</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<form id="calculator" method="post">
What Number would you like to square?
<input type="text" name="input_value">
<input type="submit" value="Go">
</form>
<div id="target"></div>
<script>
$(function() {
$('#calculator').live('submit', function(e) {
e.preventDefault(); // stops form from submitting naturally
$.ajax({
data: $(this).serialize(),
type: 'POST', //'GET' is default, set to 'POST' if you want.
url: 'square.php',
success: function(response) {
$("#target").load("square.php");
}
});
});
</script>
方形.php:
<html>
<p>Results:<br><br></p>
</html>
<?php
$input = htmlspecialchars($_POST['input_value']);
$sum = $input * $input;
echo "You wrote " . $input ." <br>";
echo $input . " squared = " .$sum . "<br><br>";
?>
您可能希望显示正方形的回声.php,这意味着您必须执行以下操作: $("#target").load(response);