ajax+php实例动态二级联菜单效果
- WBOYOriginal
- 2016-06-08 17:29:49926Durchsuche
很多朋友都是用js来实现级联菜单了，那样有一个不好就是更新可能要修改源码，现在提供的这款ajax+php是一个实时的，不好之处在于耗费服务器资源了。
main.php
<script><br />
<!--<br />
<br />
function getoption(select1,target)<br />
{<br />
if(select1.value!=0){<br />
//select1是提交数据的来源的select菜单名<br />
var url = "getoption.php?pid="+select1.value;//取得xml的url<br />
//alert(url);<br />
var ajax = InitAjax();<br />
var i = 0;<br />
ajax.open("GET", url, true);<br />
ajax.onreadystatechange = function() {<br />
//如果执行是状态正常，那么就把返回的内容赋值给指定的地方<br />
if (ajax.readyState == 4 && ajax.status == 200) {<br />
var obj = ajax.responseXML;<br />
var properties = obj.getElementsByTagName("property");<br />
var name,value;<br />
target.options.length = 1;<br />
for (var i=0,x=1;i<properties.length;i++,x++) {<br />
name = properties[i].getElementsByTagName("name")[0].firstChild.nodeValue;<br />
value = properties[i].getElementsByTagName("value")[0].firstChild.nodeValue;<br />
target.options[x] = new Option();<br />
target.options[x].text = name;<br />
target.options[x].value = value;<br />
}<br />
}<br />
}<br />
ajax.send(null);<br />
}<br />
}<br />
<br />
<br />
<form method="post" name="form" action="index.php"><br />
<select name="level1" onchange="getoption(document.form.level1,document.form.level2);"/><br />
<option selected="ture" value="0">===选择===<br />
<?<br />
if ($nrows>0){<br />
for ($i=0;$i<$nrows;$i++){<br />
echo "<option value="{$results[ID][$i]}">{$results[NAME][$i]}";<br />
}<br />
}<br />
?><br />
<br />
<select name="level2" onchange="getoption(document.form.level2,document.form.level3);"><br />
<option selected="ture" value="0">===选择===<br />
<br />
<br />
iniajax.js:<br />
function InitAjax()<br />
{<br />
var ajax=false;<br />
try {<br />
ajax = new ActiveXObject("Msxml2.XMLHTTP");<br />
} catch (e) {<br />
try {<br />
ajax = new ActiveXObject("Microsoft.XMLHTTP");<br />
} catch (E) {<br />
ajax = false;<br />
}<br />
}<br />
if (!ajax && typeof XMLHttpRequest!='undefined') {<br />
ajax = new XMLHttpRequest();<br />
}<br />
return ajax;<br />
}<br />
<br />
getoption.php:<br />
<?php<br />
if($pid=$_GET["pid"])<br />
{<br />
header("Content-type: text/xml;charset=GB2312");<br />
echo "<?xml version="1.0" encoding="GB2312"?>";<br />
include("./oracle.inc");<br />
$sql="select * from AJAXTEST where PARENTID = $pid";<br />
//echo $sql;<br />
$stmt=ociparse($handle,$sql);<br />
ociexecute($stmt);<br />
ocicommit($handle);<br />
ocilogoff();<br />
$nrows=ocifetchstatement($stmt,$results);<br />
echo "<properties>";<br />
//echo "<row>{$nrows}";<br />
for ($i=0;$i<$nrows;$i++){<br />
echo "<property>";<br />
echo "<value>{$results[ID][$i]}";<br />
echo "<name>{$results[NAME][$i]}";<br />
echo "";<br />
}<br />
echo "";<br />
}<br />
?></script>