与服务器交互的写法 <?php $conn = mysql_connect(); // 连接数据库 mysql_select_db("test"); // 选择表if(!isset($_GET['key'])) { // 检查是否有传递参数 $sql = "select * from list where type=''"; $rs = mysql_query($sql); $str = ""; while($row = mysql_fetch_array($rs)) // 循环构造初始信息 $str .= "<option value='{$row['name']}'>{$row['name']}\n"; }else { // 有,产生脚本代码 $sql = "select * from list where type='{$_GET['key']}'"; $rs = mysql_query($sql); $str = "sele2.options.length = 0;\n"; while($row = mysql_fetch_array($rs)) $str .= "sele2.options[sele2.options.length] = new Option('{$row['name']}',{$row['name']});\n"; echo $str; exit; } ?> 本方法通过改变script标记的src属性来达到动态修改列表框的内容<br> <script id="sensele" src=""></script> <script> function loadsele(v) { var s = v.options[v.selectedIndex].value; sensele.src = "?key="+s; } </script> <select id="sele1" onchange="loadsele(this)"> <?php echo $str; ?> </select> <select id="sele2"> </select> <span id="view"></span>表结构 CREATE TABLE list ( type varchar(10) NOT NULL default '', name varchar(50) NOT NULL default '' ) TYPE=MyISAM;# # 导出下面的数据库内容 `list` #INSERT INTO list VALUES ('', 'A'); INSERT INTO list VALUES ('', 'B'); INSERT INTO list VALUES ('', 'C'); INSERT INTO list VALUES ('A', '1'); INSERT INTO list VALUES ('A', '2'); INSERT INTO list VALUES ('A', '3'); INSERT INTO list VALUES ('B', '4'); INSERT INTO list VALUES ('B', '5'); INSERT INTO list VALUES ('B', '6'); INSERT INTO list VALUES ('C', '7'); INSERT INTO list VALUES ('C', '8'); INSERT INTO list VALUES ('C', '9');
你先读懂那段javascript的二级连动代码。 然后,这部分由php根据数据库中的数据输出:var team = new Array( new Array( new Array('所有类别', 0), new Array('纯陶瓷离子烫平板夹',9), new Array('铁氟龙离子烫平板夹',10), new Array('仿玉板离子烫平板夹',13) ), new Array( new Array('所有类别', 0), new Array('立体圆棒烫',11), new Array('圆弧烫发器',12) ), new Array( new Array('所有类别', 0) ), new Array( new Array('所有类别', 0) ) );
<?php
$conn = mysql_connect(); // 连接数据库
mysql_select_db("test"); // 选择表if(!isset($_GET['key'])) { // 检查是否有传递参数
$sql = "select * from list where type=''";
$rs = mysql_query($sql);
$str = "";
while($row = mysql_fetch_array($rs)) // 循环构造初始信息
$str .= "<option value='{$row['name']}'>{$row['name']}\n";
}else { // 有,产生脚本代码
$sql = "select * from list where type='{$_GET['key']}'";
$rs = mysql_query($sql);
$str = "sele2.options.length = 0;\n";
while($row = mysql_fetch_array($rs))
$str .= "sele2.options[sele2.options.length] = new Option('{$row['name']}',{$row['name']});\n";
echo $str;
exit;
}
?>
本方法通过改变script标记的src属性来达到动态修改列表框的内容<br>
<script id="sensele" src=""></script>
<script>
function loadsele(v) {
var s = v.options[v.selectedIndex].value;
sensele.src = "?key="+s;
}
</script>
<select id="sele1" onchange="loadsele(this)">
<?php echo $str; ?>
</select>
<select id="sele2">
</select>
<span id="view"></span>表结构
CREATE TABLE list (
type varchar(10) NOT NULL default '',
name varchar(50) NOT NULL default ''
) TYPE=MyISAM;#
# 导出下面的数据库内容 `list`
#INSERT INTO list VALUES ('', 'A');
INSERT INTO list VALUES ('', 'B');
INSERT INTO list VALUES ('', 'C');
INSERT INTO list VALUES ('A', '1');
INSERT INTO list VALUES ('A', '2');
INSERT INTO list VALUES ('A', '3');
INSERT INTO list VALUES ('B', '4');
INSERT INTO list VALUES ('B', '5');
INSERT INTO list VALUES ('B', '6');
INSERT INTO list VALUES ('C', '7');
INSERT INTO list VALUES ('C', '8');
INSERT INTO list VALUES ('C', '9');
但问题还得是能提交的表单来的,也就是说根据选择后来提交所选的大类和小类
进行搜索。
能否写得再详细一点么。
然后,这部分由php根据数据库中的数据输出:var team = new Array(
new Array(
new Array('所有类别', 0),
new Array('纯陶瓷离子烫平板夹',9),
new Array('铁氟龙离子烫平板夹',10),
new Array('仿玉板离子烫平板夹',13)
),
new Array(
new Array('所有类别', 0),
new Array('立体圆棒烫',11),
new Array('圆弧烫发器',12)
),
new Array(
new Array('所有类别', 0)
),
new Array(
new Array('所有类别', 0)
)
);
xuzuning(唠叨): 你的代码有问题啊?为什么在点击第一级菜单时javascript出错,说语法错,我检查了半天没有找到,你不信你再试试你的代码。。
见http://expert.csdn.net/Expert/TopicView1.asp?id=2454897
的回复
///////////////////
<html> <head> <script>
function check()
{
if(f1.d1.options[0].selected)
{
f1.d2.length=0 f1.d2.options.add(new Option("白菜","白菜"))
f1.d2.options.add(new Option("萝卜","萝卜"))
}
else if(f1.d1.options[1].selected)
{
f1.d2.length=0
f1.d2.options.add(new Option("苹果","苹果"))
f1.d2.options.add(new Option("桃","桃")) } }
</script>
</head> <body>