引言
通常需要实现这样的需求,HTML需要从PHP后端获取到一些数据进行前台展示。
本文着重解决这样的需求。
Let's do it!
PHP在获取了post的数据以后,怎样输出返回信息到原有的HTML中。
a.html文件中使用了
<form action ="b.php" method="POST">
<input type ="submit">
</form>
然后b.php处理了post请求过来的信息以后,我 想要输出一个返回信息到a.html
HTML是静态页面,一般是服务器处理后直接交由浏览器展示的。要想在原a.html中显示提交后的信息,可以有这些思路:
(1) 在b.php中处理完成后,将要输入的信息保存至
数据库
或session
等中,然后使用header
跳转到a.html,但是在服务器端要将html文件当成php页面处理,在此html中(相当于php页面),使用php语句获取要输入的信息并生成html传输到浏览器.(不推荐)(2) 同上,但是服务器端不将html当成php来解析处理,而是在此html页中使用javascript标签,链接指向某一个php,由它取出之前数据并以js语句输出,如:
a.html中:
<script src="j.php"></script>
b.php中:(略过取之前数据的过程)
echo "document.write('$message');";
- (3) 在a.html中使用
ajax
通过XMLHttpRequest
对象提交数据到b.php,处理完成后输出数据.a.html中可以在不刷新页面的情况下取得返回的信息并按你的想法显示在页面的任何地方.(推荐)
HTML调用PHP的方法
HTML本身是无法处理动态请求,要完成这个,一般是用javascript
。在生成静态网页,可以根据数据库id给html页面生成一个相对应的javascript文件引用。比如页面是123.html,那就在这个页面生成一个
<script type="text/javascript" src="click.php?id=123"></script>
然后在click.php这个页面就按照php的语法去处理操作数据库就行。
静态页面中是不能直接调用php文件,但是可以使用js调用方式来调用php文件,还可以使用ajax 调用php文件。
举一个简单的例子来说明:在页面a.html中使用如下代码,可以将action=test的参数传递到b.php。
Javascript代码如下:
<script type="text/javascript" src="b.php?action=test"></script>
在b.php中有这样一段PHP代码:
<?php
$action=$_GET['action'];
echo "document.write('".$action."');n";
?>
在html中使用php返回的数据进行界面更新
html通过js发送http请求,php返回加工过的数据,js通过回调函数加载数据。以下是用户申请访问ip后,加载到table中的例子
1.html+js部分
//js代码
<script type="text/javascript">
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
}
function start(){
createXMLHttpRequest();
var url="http://www.52300.com/yzydede/yhsetipmap.php";
xmlHttp.open("POST",url,true);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttp.onreadystatechange = callback;
xmlHttp.send("sip="+document.getElementById("sip").value);
}
function callback(){
if(xmlHttp.readyState == 4){
if(xmlHttp.status == 200 && xmlHttp.responseText != ""){
if (xmlHttp.responseText.indexOf("127") >= 0)
{
var bodyObj=document.getElementById("ipmap_list");
if(bodyObj==null)
{
alert("Body of Table not Exist!");
return;
}
var rowCount = bodyObj.rows.length;
var cellCount = bodyObj.rows[0].cells.length;
var newRow = bodyObj.insertRow(rowCount++);
newRow.insertCell(0).innerHTML=rowCount - 1;
newRow.insertCell(1).innerHTML=document.getElementById("sip").value;
newRow.insertCell(2).innerHTML=xmlHttp.responseText;
}
else
alert(xmlHttp.responseText);
}
}
}
function getyhip(){
createXMLHttpRequest();
var url="http://www.52300.com/yzydede/yhgetipmap.php";
xmlHttp.open("POST",url,true);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttp.onreadystatechange = yhcallback;
xmlHttp.send("");
}
function yhcallback(){
if(xmlHttp.readyState == 4){
if(xmlHttp.status == 200 && xmlHttp.responseText != ""){
if (xmlHttp.responseText.indexOf(".") >= 0)
{
var bodyObj=document.getElementById("ipmap_list");
if(bodyObj==null)
{
alert("Body of Table not Exist!");
return;
}
var strall= new Array();
strall=xmlHttp.responseText.split("|");
for (i=0; i<strall.length ;i++ )
{
var allip = new Array();
allip = strall[i].split("-");
var rowCount = bodyObj.rows.length;
var cellCount = bodyObj.rows[0].cells.length;
var newRow = bodyObj.insertRow(rowCount++);
newRow.insertCell(0).innerHTML=rowCount - 1;
for (j=0; j<allip.length; j++)
newRow.insertCell(1+j).innerHTML=allip[j];
}
}
else
alert(xmlHttp.responseText);
}
}
}
</script>
//点击按钮触发更新
<input style="width:150px;margin-top:10px; margin-bottom:20px;" class="button_blue" type="button" value="申请防护" onclick="start()" />
//刷新网页更新
<script type="text/javascript">
getyhip();
</script>
2.php代码
<?php
echo "hello world."; //这是需要加工后返回的数据
?>
参考代码
本段主要为大家详细介绍HTML中嵌入PHP的简单方法,以一个实例实现php嵌入到html文件中,感兴趣的小伙伴们可以参考一下
我们以一个提交订单和显示订单信息的例子为学习PHP的开始。
这个例子包含两个文件。
一个提交订单的html文件:orderform.html
一个显示订单信息的php文件:processorder.php。
我将这两个文件放在test_1文件夹下,将test_1文件夹放在htdocs目录下。
文件的组织形式如下图所示,使用xampps安装的集成环境。
提交订单的html文件orderform.html如下所示:
<form action="processorder.php" method="post">
<table>
<tr bgcolor="#cccccc">
<td width="150">Item</td>
<td width="15">Quantity</td>
</tr>
<tr>
<td>Tires</td>
<td align="center"><input type="text" name="tireqty" size="3" maxlength="3" /></td>
</tr>
<tr>
<td>Oil</td>
<td align="center"><input type="text" name="oilqty" size="3" maxlength="3" /></td>
</tr>
<tr>
<td>Spark Plugs</td>
<td align="center"><input type="text" name="sparkqty" size="3" maxlength="3" /></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit" value="Submit Order" /></td>
</tr>
</table>
</form>
显示订单信息的php文件processorder.php如下所示:
<?php
// create short variable names, also can use '$_REQUEST['name']'
$tireqty = $_POST['tireqty'];
$oilqty = $_POST['oilqty'];
$sparkqty = $_POST['sparkqty'];
?>
<!DOCTYPE html>
<html>
<head>
<title>Bob 's Auto Parts - Order Results</title>
</head>
<body>
<h1>Bob 's Auto Parts</h1>
<h2>Order Results</h2>
<?php
echo "<p>Order processed at ";
echo date('H:i, jS F Y')."</p>";
echo "<p>Your order is as follows: </p>";
echo "$tireqty tires<br />";
echo $oilqty.' bottles of oil<br />';
echo $sparkqty." spark plugs<br />"
?>
---------------------------------------------------<br />
<?php
$testHeredoc = <<< EOF
line 1
line 2
line 3
EOF;
echo "$testHeredoc"."<br />";
?>
---------------------------------------------------<br />
<?php
echo "About Comment:";
//Here is a comment.
#Here is a comment too.
/*
Here is multi line comment.
Here is multi line comment.
*/
?>
</body>
</html>
填入数字,然后点击“Submit Order”按钮提交内容。则页面将显示processorder.php经过PHP解析器解析之后生成的html页面,如下所示:
在这个例子中,我们可以学习到以下几点内容:
- 在html中嵌入php代码的语法格式为: <?php 代码内容 ?> ,需要注意的是开始符号“<?php”中间不能有空格。
- post方法提交的表单内容可以通过php的“$_POST[]”数组按照name获取,也可以通过“$_REQUEST[]”数组获取。这些数组为超级全局变量。
- 字符串可以用单引号也可以使用双引号引起来, 也可以用反单引号引起来(反单引号在键盘最左上角,与~是一个键)。
三种引号作用不同:
- 单引号内的字符串将被当作纯文本原样输出;
- 双引号中如果有变量,则会替换成变量的值然后输出文本;
- 反单引号被叫做执行符,php解析器会先执行反单引号中的内容,将执行之后的结果返回。
- 字符串可以使用点号“.”连接在一起。在php中点号是唯一的字符串连接符,相当于java中的“+”。
- php中有三种注释方式:分别为类Java的单行注释“//”;类shell的单行注释“#”;类Java的多行注释“/**/”。
6.php中所有的变量使用时都是以“$”打头的, 并且变量使用时不需要提前声明。
而且变量的类型也可以随时改变,这取决于赋值给变量的值的类型。php变量的类型是在每一次赋值时确定和改变的。