ecshop模板中如何实现局部刷新
2012-08-11 22:23
232 查看
建立一个ajax.js文件，代码如下：
// JavaScript Document
var xmlHttp;
function S_xmlhttprequest()
{
xmlHttp=null;
if (window.XMLHttpRequest)
{// code for IE7, Firefox, Opera, etc.
xmlHttp=new XMLHttpRequest();
}
else if (window.ActiveXObject)
{// code for IE6, IE5
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
function getName(name)
{
if(name = document.myform.name.value)
{
S_xmlhttprequest();
xmlHttp.open("get","date.php?name="+name,true);
xmlHttp.onreadystatechange = byname;
xmlHttp.send(null);
}
}
function byname()
{
if(xmlHttp.readyState ==1)
{
document.getElementById('name').innerHTML = "<font color=red>loading....</font>";
}
if(xmlHttp.readyState == 4)
{
if(xmlHttp.status == 200)
{
var name = xmlHttp.responseText;
document.getElementById('name').innerHTML = name;
}
}
}
function getEmail(email)
{
var email = document.myform.email.value;
if(email =="")
{
alert("用户名不能为空");
document.myform.email.focus();
return false;
}
else
{
S_xmlhttprequest();
xmlHttp.open("get","date.php?email="+email,true);
xmlHttp.onreadystatechange = byemail;
xmlHttp.send(null);
}
}
function byemail()
{
if(xmlHttp.readyState ==1)
{
document.getElementById('email').innerHTML = "<font color=red>loading....</font>";
}
if(xmlHttp.readyState == 4)
{
if(xmlHttp.status == 200)
{
var email = xmlHttp.responseText;
document.getElementById('email').innerHTML = email;
}
}
}
建立一个register.php文件，代码如下：
<title>注册页面</title>
<script src="Ajax.js" language="javascript">
</script>
<body>
<form action="" method="post" name="myform">
<table align="center">
<tr><td>用户名:</td><td><input type="text" name="name" value="" onblur="getName('name')"/></td><td><div id="name"><font color="#CC66CC">*用户名必填*</font></div></td></tr>
<tr><td>邮箱:</td><td><input type="text" name="email" value="" onblur="getEmail('email')"/></td><td><div id="email"><font color="#CC66CC">*邮箱必填*</font></div></td></tr>
</table>
</form>
建立一个date.php页面，用于查询数据库 ：
<?
sleep(1);
$connt = mysql_connect("localhost","root","123456");
mysql_select_db('test',$connt );
mysql_query("set names 'gb2312'");
if($_GET['name'])
{
$name = $_GET['name'];
$sql = "select * from test where name='$name'";
$restul = mysql_query($sql);
$array = mysql_fetch_row($restul);
// print_r($array);
if(is_array($array))
{
echo "<font color='red'>该用户名已经存在</font>";
}
else
{
echo "<font color='red'>该用户名可以用</font>";
}
}
if($_GET['email'])
{
$name = $_GET['email'];
$sql = "select * from test where email='$email'";
$restul = mysql_query($sql);
$array = mysql_fetch_row($restul);
// print_r($array);
if(is_array($array))
{
echo "<font color='red'>该邮箱已存在</font>";
}
else
{
echo "<font color='red'>该邮箱可以用</font>";
}
}
?>
// JavaScript Document
var xmlHttp;
function S_xmlhttprequest()
{
xmlHttp=null;
if (window.XMLHttpRequest)
{// code for IE7, Firefox, Opera, etc.
xmlHttp=new XMLHttpRequest();
}
else if (window.ActiveXObject)
{// code for IE6, IE5
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
function getName(name)
{
if(name = document.myform.name.value)
{
S_xmlhttprequest();
xmlHttp.open("get","date.php?name="+name,true);
xmlHttp.onreadystatechange = byname;
xmlHttp.send(null);
}
}
function byname()
{
if(xmlHttp.readyState ==1)
{
document.getElementById('name').innerHTML = "<font color=red>loading....</font>";
}
if(xmlHttp.readyState == 4)
{
if(xmlHttp.status == 200)
{
var name = xmlHttp.responseText;
document.getElementById('name').innerHTML = name;
}
}
}
function getEmail(email)
{
var email = document.myform.email.value;
if(email =="")
{
alert("用户名不能为空");
document.myform.email.focus();
return false;
}
else
{
S_xmlhttprequest();
xmlHttp.open("get","date.php?email="+email,true);
xmlHttp.onreadystatechange = byemail;
xmlHttp.send(null);
}
}
function byemail()
{
if(xmlHttp.readyState ==1)
{
document.getElementById('email').innerHTML = "<font color=red>loading....</font>";
}
if(xmlHttp.readyState == 4)
{
if(xmlHttp.status == 200)
{
var email = xmlHttp.responseText;
document.getElementById('email').innerHTML = email;
}
}
}
建立一个register.php文件，代码如下：
<title>注册页面</title>
<script src="Ajax.js" language="javascript">
</script>
<body>
<form action="" method="post" name="myform">
<table align="center">
<tr><td>用户名:</td><td><input type="text" name="name" value="" onblur="getName('name')"/></td><td><div id="name"><font color="#CC66CC">*用户名必填*</font></div></td></tr>
<tr><td>邮箱:</td><td><input type="text" name="email" value="" onblur="getEmail('email')"/></td><td><div id="email"><font color="#CC66CC">*邮箱必填*</font></div></td></tr>
</table>
</form>
建立一个date.php页面，用于查询数据库 ：
<?
sleep(1);
$connt = mysql_connect("localhost","root","123456");
mysql_select_db('test',$connt );
mysql_query("set names 'gb2312'");
if($_GET['name'])
{
$name = $_GET['name'];
$sql = "select * from test where name='$name'";
$restul = mysql_query($sql);
$array = mysql_fetch_row($restul);
// print_r($array);
if(is_array($array))
{
echo "<font color='red'>该用户名已经存在</font>";
}
else
{
echo "<font color='red'>该用户名可以用</font>";
}
}
if($_GET['email'])
{
$name = $_GET['email'];
$sql = "select * from test where email='$email'";
$restul = mysql_query($sql);
$array = mysql_fetch_row($restul);
// print_r($array);
if(is_array($array))
{
echo "<font color='red'>该邮箱已存在</font>";
}
else
{
echo "<font color='red'>该邮箱可以用</font>";
}
}
?>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 如何用UpatePanel实现省市区的局部刷新
- 如何用php+ajax实现页面的局部刷新？（转）
- .net MVC中如何使用iframe实现局部刷新
- ajax如何实现局部刷新
- AJAX的原理―如何做到异步和局部刷新【实现代码】
- 如何实现局部刷新
- notifyDataSetChanged()源码分析以及如何实现ListView局部刷新
- jquery刷新页面的实现代码（局部及全页面刷新）
- Ajax显示当前时间（实现页面局部刷新）
- 如何运用PHP Ajax实现图片的无刷新上传
- 用一般处理程序制作验证码以及验证码局部刷新的实现
- ASP.NET使用ajax实现分页局部刷新页面功能
- 如何将Pjax整合进网站，实现全站无刷新加载？
- 如何实现无刷新的DropdownList联动效果[转]
- Android下拉刷新完全解析，教你如何一分钟实现下拉刷新功能
- ajax如何实现页面局部跳转与结果返回
- MVC3.0 采用Jquery实现局部刷新
- eclipse 插件开发中如何实现刷新和重编译
- .NET中使用js实现百度搜索下拉提示效果[不是局部刷新，呜呜。。]
- jQuery实现AJAX定时局部页面刷新