Ajax效果

最新推荐文章于 2022-09-08 20:41:18 发布

dianmei3204

最新推荐文章于 2022-09-08 20:41:18 发布

阅读量134

点赞数

文章标签： php javascript 数据库 ViewUI

原文链接：http://www.cnblogs.com/lzzhuany/p/4859542.html

版权

Ajax的效果就是不通过网页的跳转，就可以通过请求，就可以自动加载某个网页，在注册帐号时，经常

不通过网页跳转从数据库中查看是否有相同数据的出现，确认是否能够正确注册

下面是用其他方式实现ajax的效果

1，用http 204属性，强制不跳转

投票页

<html>
<head>
<title>投票网</title>
</head>
<body>
<div style="width:100px; height:100px; background:red; font-size:20px">这是投票的内容</div>
<a href="02.php">投票</a>
</body>
</html>

接收页面
<?php
header('HTTP/1.1  204  No Content');
$cnt=file_get_contents('res.txt');
$cnt+=1;
file_put_contents('./res.txt',$cnt);
?>

2,使用图片加载特性，实现页面不跳转

<html>
<head>
<title>投票网</title>
<script type="text/javascript">
function toupiao(){
	var img=document.createElement('img');//创建img标签
	img.setAttribute('src','./02.php');//设置图片地址为请求页面，实现自动请求
}
</script>
</head>
<body>
<div style="width:100px; height:100px; background:red; font-size:20px">这是投票的内容</div>

<input type="button" value="投票" οnclick="toupiao();"/>
</body>
</html>

3,利用css和js的方式实现

4,利用iframe框架的特性实现
<html>
<head>
<title>投票网</title>
</head>
<body>
<div id="regs"></div>
<div style="width:100px; height:100px; background:red; font-size:20px">这是投票的内容</div>
<form action="03.php" method="post" target="reg">
<p>用户名:<input type="text" name="username"></p>
<p>密码:<input type="password" name="psw"></p>
<p><input type="submit" value="注册"></p>
</form>
<iframe width="0" height="0" frameBorder="0" name="reg"></iframe>
</body>
</html>

03.php

<script type="text/javascript">
parent.document.getElementById("regs").innerHTML="注册成功";
</script>

转载于:https://www.cnblogs.com/lzzhuany/p/4859542.html

dianmei3204

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Ajax效果

Ajax的效果就是不通过网页的跳转，就可以通过请求，就可以自动加载某个网页，在注册帐号时，经常不通过网页跳转从数据库中查看是否有相同数据的出现，确认是否能够正确注册下面是用其他方式实现ajax的效果1，用http 204属性，强制不跳转投票页<html><head><title>投票网&...
复制链接

扫一扫