php+mysql 采用ajax技术的 省 市 地 3级联动无刷新菜单 源码
很简单的
1.先把 <script language="JavaScript" src="../include/js/regions.js"></script>
加到 header.html 页
2.把 regionss() 函数 加到 /include/tag.php 里
3.在你网站的根目录建立个 regions.php 文件
4.在你的模板的适当的地方加入 {$regionss(中华人民共和国)} 即可
注意： 表单的名字可根据你的需要可以自己修改...
测试页代码：
<html>
<head>
<meta http-equiv="Content-Type" c />
<title>php+ajax动态生成下拉菜单</title>
<script language="JavaScript" src="../include/js/regions.js"></script>
</head>
<body>
<form name="form1" method="post" action="">
<tr><td>{$regionss(中华人民共和国)}</td></tr>
</form>
</body>
</html>
regionss 函数代码：
//省市地3级联动下拉菜单函数 regionss 省.市.地
function regionss($country="中华人民共和国")
{
global $db; $i = 1;
$text="<select id=\"select1\" name=\"select1\" onchange=\"startRequest()\" style=\"width:90px;\"><option value=\"\">省/市/自治区</option>\n";
$result = $db->query("SELECT province FROM ".TABLE_PROVINCE." WHERE country='$country' ORDER BY provinceid");
while($r = $db->fetch_array($result))
{
$text .= "<option value=".$r['province'].">".$r['province']."</option> ";
$i++;
}
$text.="</select>";
$text.=" <select id=\"select2\" name=\"select2\" onchange=\"startRequesta()\" style=\"width:90px;\"><option value=\"\">市/县/区</option></select>\n";
$text.="<select id=\"select3\" name=\"select3\" style=\"width:90px;\"><option value=\"\">县级市/县</option></select>\n";
return $text;
}
regions.js 的代码：
//var ab = new Array();
var xmlHttp;
var xmlHttpa;
function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}
function createXMLHttpRequesta() {
if (window.ActiveXObject) {
xmlHttpa = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
xmlHttpa = new XMLHttpRequest();
}
}
function startRequest() {
createXMLHttpRequest();
createXMLHttpRequesta();
xmlHttp.onreadystatechange = handleStateChange;
xmlHttpa.onreadystatechange = handleStateChangearea;
document.getElementById('select2').options.length = 0;
document.getElementById('select3').options.length = 0;
var url = document.form1.select1.value;
var qurl = "/regions.php?province="+url+"&time="+new Date().getTime();
xmlHttp.open("GET", qurl, true);
xmlHttp.send(null);
//setTimeout("startRequest()",2000);
}
function handleStateChange() {
if(xmlHttp.readyState == 4) {
if(xmlHttp.status == 200) {
var obj = document.getElementById('select2'); //将服务器返回的字符串写到页面中ID为select2的区域
obja = document.getElementById('select3'); //将服务器返回的字符串写到页面中ID为select3的区域
eval(xmlHttp.responseText);
}
}
}
function handleStateChangearea() {
eval(xmlHttpa.responseText);
}
//var ab = new Array();
function startRequesta() {
createXMLHttpRequesta();
xmlHttpa.onreadystatechange = handleStateChangea;
document.getElementById('select3').options.length = 0;
var url = document.form1.select2.value;
var qurl = "/regions.php?city="+url+"&time="+new Date().getTime();
xmlHttpa.open("GET", qurl, true);
xmlHttpa.send(null);
//setTimeout("startRequest()",2000);
}
function handleStateChangea() {
if(xmlHttpa.readyState == 4) {
if(xmlHttpa.status == 200) {
var obja = document.getElementById('select3');
eval(xmlHttpa.responseText);
//将服务器返回的字符串写到页面中ID为select3的区域
}
}
}
数据岛 regions.php 页面代码
<?php
require "common.php";
$city = $city ? $city : "";
$area = $area ? $area : "";
if($province && $city==''){
global $db; $i = 1;
$result = $db->query("SELECT DISTINCT city FROM ".TABLE_CITY." WHERE province='$province' ORDER BY cityid");
while($r = $db->fetch_array($result))
{
$r[city]=iconv('gb2312','UTF-8',$r[city]);
echo "obj.options[obj.options.length] = new Option('".$r[city]."','".$r[city]."');\n";
$i++;
}
$resultarea = $db->query("SELECT DISTINCT city FROM ".TABLE_CITY." WHERE province='$province' ORDER BY cityid");
$r = $db->fetch_array($resultarea);
$city = $r[city];
$resulta = $db->query("SELECT DISTINCT area FROM ".TABLE_CITY." WHERE city='$city' ORDER BY cityid");
while($ra = $db->fetch_array($resulta))
{
$ra[area]=iconv('gb2312','UTF-8',$ra[area]);
echo "obja.options[obja.options.length] = new Option('".$ra[area]."','".$ra[area]."');\n";
$i++;
}
}
if($city && $province==''){
global $db; $i = 1;
$result = $db->query("SELECT DISTINCT area FROM ".TABLE_CITY." WHERE city='$city' ORDER BY cityid");
while($r = $db->fetch_array($result))
{
$r[area]=iconv('gb2312','UTF-8',$r[area]);
echo "obja.options[obja.options.length] = new Option('".$r[area]."','".$r[area]."');\n";
$i++;
}
}
?>
地址信息数据库：
采用的是phpcms3.0里自带的数据库，我没有进行任何改动
本程序可以在phpcms3.0里直接使用，若在其他地方使用请自己修改
多文件上传是PHP中一基础应用，在此把相关知识向大家详细介绍一下，本人水平有限，还请多提意见。大家一起进步。
上传文件HTML的输入标签FILE类型中的名称后要加[]，作用是在HTML中向PHP建立数组，比如名称为pictures，多文件引用名称则为pictures[],实例如下：
复制内容到剪贴板
<form action="upload.php" method="post" enctype="multipart/form-data">
<p>
<input type="file" name="pictures[]" /><br />
<input type="file" name="pictures[]" /><br />
<input type="file" name="pictures[]" /><br />
<input type="submit" value="上传" />
</p>
</form> //手册中实例。
利用HTML文件建立数组的方法手册中是这样讲解的：
要使你的 <form> 结果被当成 array 发送到 PHP 脚本，要对 <input>，<select> 或者 <textarea> 单元这样命名：
<input name="MyArray[]" />
<input name="MyArray[]" />
<input name="MyArray[]" />
<input name="MyArray[]" />
注意变量名后的方括号，这使其成为一个数组。
可以通过给不同的单元分配相同的名字来把单元分组到不同的数组里：
<input name="MyArray[]" />
<input name="MyArray[]" />
<input name="MyOtherArray[]" />
<input name="MyOtherArray[]" />
这将产生两个数组，MyArray 和 MyOtherArray，并发送给 PHP 脚本。
还可以给数组分配指定的键名：
<input name="AnotherArray[]" />
<input name="AnotherArray[]" />
<input name="AnotherArray[email]" />
<input name="AnotherArray[phone]" />
AnotherArray 数组将包含键名 0，1，email 和 phone。
注意: 指定数组的键名是 HTML 的可选项。如果不指定键名，则数组被按照单元在表单中出现的顺序填充。第一个例子将包含键名 0，1，2，3。
以上HTML点击上传后，通过$_FILES超级全局变量进行读取，$_FILES将会把HTTP POST 方法传递上来的文件信息组合成数组，一个文件数组形式为二维。二个以上文件数组形式为三维。
$_FILES的使用方法：
$_FILES['userfile']['name']
客户端机器文件的原名称。
$_FILES['userfile']['type'] 文件的 MIME 类型，如果浏览器提供此信息的话。一个例子是“image/gif”。不过此 MIME 类型在 PHP 端并不检查，因此不要想当然认为有这个值。
$_FILES['userfile']['size'] 已上传文件的大小，单位为字节。
$_FILES['userfile']['tmp_name'] 文件被上传后在服务端储存的临时文件名。
$_FILES['userfile']['error']
下面是一个文件上传，此文件上传后$_FILES数组内将会产生其信息，因为是一个文件所以是二维的，为了便于大家理解我们将$_FILES用PRINT_R输出查看其结构。
HTML文件：
<form action="upload.php" method="post" enctype="multipart/form-data">
<p>
<input type="file" name="pictures" /><br />
<input type="submit" value="上传" />
</p>
</form>
PHP接收文件：
<?php
print_r($_FILES);
?>
将其令存为UPLOAD.PHP，运行上面的HTML选择一个文件上传，比如文件名为Thumbs.db,在IE浏览器内单击“查看”，“源代码”。显示如下：
Array
(
[pictures] => Array
(
[name] => Thumbs.db //原文件名
[type] => application/octet-stream //文件类型
[tmp_name] => D:EasyPHP\tmpphp64.tmp //临时存储目录及文件名
[error] => 0 //错误代码 0为上传成功
[size] => 23040 //文件大小
)
)根据此信息，结合上面$_FILES的使用方法，大家应该能理解的更深刻一些。
下面看一下多文件上传，三个文件名分别为FILE1.TXT,FILE2.TXT,FILE3.TXT,然后用PRINT_R输出查看其结构：
HTML文件代码：
<form action="upload.php" method="post" enctype="multipart/form-data">
<p>
<input type="file" name="pictures[]" /><br />
<input type="file" name="pictures[]" /><br />
<input type="file" name="pictures[]" /><br />
<input type="submit" value="上传" />
</p>
</form>
PHP接收文件代码：
<?php
print_r($_FILES);
?>
查看源文件：
Array
(
[pictures] => Array
(
[name] => Array
(
[0] => file1.txt
[1] => file2.txt
[2] => file3.txt
)
[type] => Array
(
[0] => application/octet-stream
[1] => application/octet-stream
[2] => application/octet-stream
)
[tmp_name] => Array
(
[0] => D:EasyPHP\tmpphp47.tmp
[1] => D:EasyPHP\tmpphp48.tmp
[2] => D:EasyPHP\tmpphp49.tmp
)
[error] => Array
(
[0] => 0
[1] => 0
[2] => 0
)
[size] => Array
(
[0] => 94289
[1] => 65536
[2] => 102400
)
)
)
假设名为 /file1.txt 和 /file2.txt 的文件被提交，则 $_FILES['pictures']['name'][0] 的值将是 file1.txt，而 $_FILES['pictures']['name'][1] 的值将是 file2.txt。类似的，$_FILES['file2.txt']['size'][0] 将包含文件 file1.txt 的大小，依此类推。
GZIP（GNU-ZIP）是一种压缩技术。经过GZIP压缩后页面大小可以变为原来的30%甚至更小。这样用户浏览的时候就会感觉很爽很愉快！
要实现GZIP压缩页面需要浏览器和服务器共同支持，实际上就是服务器压缩，传到浏览器后浏览器解压并解析。浏览器那边不需要我们担心，因为现在绝大多数浏览器都支持解析GZIP过的页面。我们只要把页面在服务器端压缩再输出到浏览器就行了。
有点罗嗦，下面说正事：
正如要制作压缩饼干，先要拿到原料，要压缩一个页面，首先要获得要输出的内容。PHP中的ob_start()（ob => output buffer）函数可以实现这个功能，它可以把程序里准备输出的内容先放到一个叫做“缓冲区”的地方，当然，你可以理解为制作压缩饼干的暂时放原料的工作台。
这个函数一定要在页面输出之前使用，所以一般把它放在代码的最顶端。因为它就像是一个工作台，所以你要在原料到来之前就要准备好它，否则原料来了没地方放，会出问题的。用ob_start()得到要压缩的页面之后，我们就可以制作压缩饼干了，不对，应该是可以压缩页面了！不过好像还缺少一台压缩机，EZ，我们用PHP带的zlib扩展做一台：
{
if( !headers_sent() && // 如果页面头部信息还没有输出
extension_loaded("zlib") && // 而且zlib扩展已经加载到PHP中
strstr($_SERVER["HTTP_ACCEPT_ENCODING"],"gzip")) //而且浏览器说它可以接受GZIP的页面
{
$content = gzencode($content." \n//此页已压缩",9); 为准备压缩的内容贴上“//此页已压缩”的注释标签，然后用zlib提供的gzencode()函数执行级别为9的压缩，这个参数值范围是0-9，0表示无压缩，9表示最大压缩，当然压缩程度越高越费CPU。
//然后用header()函数给浏览器发送一些头部信息，告诉浏览器这个页面已经用GZIP压缩过了！
header("Content-Encoding: gzip");
header("Vary: Accept-Encoding");
header("Content-Length: ".strlen($content));
}
return $content; //返回压缩的内容，或者说把压缩好的饼干送回工作台。
}
压缩机做好了之后，我们把压缩机放到工作台上，于是原来的ob_start()变成
好了，所有的工作已完成，最后交货：
完整的示例如下：
//启用一个带有ob_gzip压缩机的工作台
ob_start('ob_gzip');
//准备一些待压缩的内容
for($i=0; $i<100; $i++)
{
echo('这里是压缩饼干的原料，这里是压缩饼干的原料，原料');
}
//输出压缩成果
ob_end_flush();
//这是ob_gzip压缩机
function ob_gzip($content)
{
if( !headers_sent() &&
extension_loaded("zlib") &&
strstr($_SERVER["HTTP_ACCEPT_ENCODING"],"gzip"))
{
$content = gzencode($content." \n//此页已压缩",9);
header("Content-Encoding: gzip");
header("Vary: Accept-Encoding");
header("Content-Length: ".strlen($content));
}
return $content;
}
?>
经过实际测试，上面代码中如果不用GZIP，是4.69KB=4802.56B，启用GZIP后缩小为104B 
，呃……我数学可能不好，自己算下压缩到了原来的百分之多少吧。。
另外，下面是用FlashGet获取的日志信息，可以看到我们程序里加的header信息：
Fri Jan 25 17:53:10 2008 Server: Microsoft-IIS/5.1
Fri Jan 25 17:53:10 2008 Date: Fri, 25 Jan 2008 09:53:10 GMT
Fri Jan 25 17:53:10 2008 Connection: close
Fri Jan 25 17:53:10 2008 X-Powered-By: PHP/5.2.5
Fri Jan 25 17:53:10 2008 Content-Encoding: gzip
Fri Jan 25 17:53:10 2008 Vary: Accept-Encoding
Fri Jan 25 17:53:10 2008 Content-Length: 104
Fri Jan 25 17:53:10 2008 Content-type: text/html
//
原创作品
本站原创:www.111cn.net
作者:面条爱兔子 QQ:271728967
注明:转载请说明原出去 http://www.111cn.net
//
现在来讲一下post.php文件了,post.php文件很简单,这个不一定用php可以用很多,只要是服务器脚都可以完成,{个人意见}
header("Content-type:text/html;charset=gb2312");我只说讲这一句了,设置文档编码.
$key =isset($_POST['key'])?$_POST['key']:'';
$sql ="select title from test where title like '%$key%' order by title desc";
$result =mysql_query($sql) or die(mysql_error());
echo"<div id=show >";
while ($rs =mysql_fetch_array($result) ){
echo "<li onMouseOver=\"this.style.background='#d7ebff'\" onMouseOut=\"this.style.background='#ffffff'\" onclick=\"javascript:fillin(this.innerHTML);\">".$rs['title']."</li>";
}
echo"</div>";
php+ajax实现google搜索功能二[原创].
浏览地址:http://www.111cn.net/test/test.html
//
原创作品
本站原创:www.111cn.net
作者:面条爱兔子 QQ:271728967
注明:转载请说明原出去 http://www.111cn.net
//
现在长沙下着大雪啊,晚上回家也没什么事作,白天在公司写一个BBS完成了一部份,突然昨天听一个网友说如果能实现google效果就好了,今天无聊之下就想了想,觉得这个用ajax做应该不是什么难道了,就试着写了,说句实话我学ajax时间很短,也只懂皮毛了,各位看了后别丢石头了,把钱包丢过来吧,过年没钱用,;)呵呵.好了废话就不多说了下面进行正题.
首先我总体的简介一下,我只用了两个文件了,因为是测试所以就不分那么清楚了,把js文件和html写在一个文件test.html里面了,还有一个就是php文件post.php了,这个文件用来处理ajax发送过来的数进行处理,再由ajax把数据返回给test.html里面的div, 原理不这么简单了,下面我们来看代码.
第一步创建数据表:test
CREATE TABLE `test` (
`id` int(4) NOT NULL auto_increment,
`title` varchar(50) default NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312 AUTO_INCREMENT=5 ;
好了数据库创建成功了我们就来建立test.html文件,这个文件很简单,就是一个表单和一个div和CSS
<style>
<!--
body{font-size:12px;}
#show{border:1px solid #9abcde; line-height:23px; width:200px; margin:0px;}
#show li{list-style:none;}
#sug{margin:0px auto;}
-->
</style>
上面为CSS了就是用来控制效果的,
<table width="400" border="0" align="center" cellpadding="0" cellspacing="0">
<form name="form1" method="post" action=""><tr>
<td>
<input name="key" type="text" id="key" onFocus="other();" onKeyDown="sugguest();" onBlur="losefouse();" size="27" autocomplete=off >
<input type="submit" name="Submit" value="111cn搜索">
</td>
</tr></form>
<tr>
<td><div id="sug" onClick="javascript:func();"></div></td>
</tr>
</table>
这上面为内容了,关于函数我们下面来具体的说明.
第二步:就是js和xmlhttp的处理和调用了.
创建xmlhttp,这个函数我上次讲ajax+php模仿window文件管理器时讲过了,在用户注册也讲过了,这里不不说了,具体地址请到:
var xmlHttp = false;
function ajaxcreate(){
try {xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
xmlHttp = false;
}
}
if (!xmlHttp && typeof XMLHttpRequest != \\\'undefined\\\') {
xmlHttp = new XMLHttpRequest();
}
if(!xmlHttp){alert(\\\'Create Xmlhttp Fail \\\');return false;}
}
下面这个函数sugguest()作用是取得key的值并发送给post文件进行处理,再调用returnstate()函数
function sugguest(){
ajaxcreate();
var xmvalue=document.getElementById("key").value;
var url="post.php?key="+encodeURI(xmvalue)+"rnd="+Math.random();
if (xmvalue== null || xmvalue.length>20 || xmvalue == "") return false;
xmlHttp.open("POST",url,true);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttp.send(xmvalue);
xmlHttp.onreadystatechange=returnstate;
}
下面returnstate()函数是判断xmlhttp的状态是否等4,4表示发送成功,其实还一个200表示接收完毕
function returnstate(){
if(xmlHttp.readyState != 4 ){
document.getElementById("sug").innerHTML="plase wait....";
}
if(xmlHttp.readyState == 4 ){
document.getElementById("sug").innerHTML=xmlHttp.responseText;
}
}
后面这些函数就是一些基本的处理我就不讲了,
function fillin(str){
document.getElementById(\\\'key\\\').value=str;
obj =document.getElementById(\\\'sug\\\');
obj.innerHTML=\\\'\\\';
obj.style.display=\\\'none\\\';
}
function other(){
document.getElementById(\\\'sug\\\').style.display=\\\'block\\\';
}
function losefouse(){
setInterval("func()",4000);
var time=setInterval("func()",1000);
clearTimeout(time);
}
function func(){
ob=document.getElementById(\\\'sug\\\');
ob.style.display = \\\'none\\\';
}
最后面就是post.php文件了,接着下一篇了.
php+ajax实现google搜索功能二[原创]
效果浏览地址:http://www.111cn.net/test/test.html
相关文章
php无刷新利用iframe实现页面无刷新上传文件(1/2)
利用form表单的target属性和iframe 一、上传文件的一个php教程方法。 该方法接受一个$file参数，该参数为从客户端获取的$_files变量，返回重新命名后的文件名，如果上传失...2016-11-25jQuery+PHP发布的内容进行无刷新分页（Fckeditor）
这篇文章将使用jQuery，并结合PHP，将Fckeditor发布的内容进行分页，并且实现无刷新切换页面。 本文假设你是WEB开发人员，掌握了jQuery和PHP相关知识，并且熟知Fckeditor的配置和使用。...2015-10-23OPPO R9s如何开启Real原声技术？OPPO R9s开启Real原声技术教程
本篇文章介绍了OPPO R9s如何开启Real原声技术的方法，有需要的小伙伴可以进来看一看。 OPPO R9s如何开启Real原声技术？Real原声技术是R9s自带的音质提升技术，开启之后...2016-12-31- 本文就是和大家分享一款由php结合ajax实现的无刷新留言板，先给大家看一下最后的效果图：数据库连接代码如下： <?php$conn = @mysql_connect("localhost","root","root") or die ("MySql连接错误");mysql_select_db("d...2015-10-30
- 这篇文章主要介绍了基于jquery实现表格无刷新分页，功能实现了前端排序功能，增加了前端搜索功能，感兴趣的小伙伴们可以参考一下...2016-01-08
- 如果你mysql查询出来乱码的话，多半是中文乱码了了，这种问题解决办法只需要统一页面与数据连接时的编码设置就可以解决，下面总结了些方法。 在mysql_connect后面加一...2016-11-25
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1...2016-11-25
- 主题皮肤切换功能在很多网站和系统中应用，用户可以根据此功能设置自己喜欢的主题颜色风格，增强了用户体验。本文将围绕如何使用jQuery实现点击无刷新切换主题皮肤功能。实现该功能的原理就是通过点击定义的主题样式，改变...2015-10-23
- 其它原理很简单，利用form表单的target属性和iframe来实现的，打开为iframe试就行了，返回就利用js判断php教程运行后返回的参数是不是成功 一、上传文件的一个php方法。...2016-11-25
- 1:为什么我得不到变量 我在一网页向另一网页POST数据name，为什么输出$name时却得不到任何值? 在PHP4.2以后的版本中reGISter_global默认为off 若想取得从另一页...2016-11-25
- iframe无刷新文件上传其实就是在当前页面打开了上传程序的页面，有点像ajax局部刷新一个，只是我们把它放到了iframe页面中上传，同时我们把iframe页面给隐藏了。 一个...2016-11-25
- 本文章简单的介绍了二种关于php ajax实现无刷新检测用户名是否可用，有我是利用了jquery的$.ajax来实例，有需要的朋友可以参考一下本实例。 前 言...2016-11-25
- 本文介绍了一款无刷新的新闻留言系统，最简明易懂的一个ajax无刷新留言系统，源码中省略了接受数据验证的过程，大家可根据自己的需求进行扩展，下面进入主题。核心源码：1.配置文件:config.php,代码如下：<?php //数据库配...2015-10-30
- 这篇文章主要为大家详细介绍了Windows下php+mysql5.7配置教程，具有一定的参考价值，感兴趣的小伙伴们可以参考一下 WINDOWS 下 PHP+MYSQL配置下载mysql地址：https://d...2017-07-06
- 本文章来给大家介绍一个原生态的ajax+php无刷新回贴和注册检验实例，如果你对此有兴趣不防进入参考哦。 先看xin.sql数据库，我们可直接复制保存成xxx.sql哦。 ...2016-11-25
- 本文章要讲的php 缓存技术是讲把数据生成一个临时缓存文件保存到硬盘，然后根据缓存文件设定的时间删除缓存文件再次生成新的缓存文件哦。 代码如下 复制...2016-11-25
- <!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/...2016-11-25
- PHP是一个什么原因出现的呢？它是一个技术人员希望能用一个快速的方面来完成他自己的个人主页中的一个小应用。而在他一发不可收时出现了php，它使一个人能在多种操作系统...2016-11-25
- ajax.net +jquery 无刷新三级联动的实例代码，需要的朋友可以参考一下...2021-09-22
- 本实例介绍了在利用thinkajax中的无刷新技术来实例异步传输，有需要的朋友可以参考一下。 ThinkPHP的官方文档没有给出ThinkAjax的使用方法，令很多初学者使用起来有...2016-11-25