html文件:
创新互联建站服务项目包括都江堰网站建设、都江堰网站制作、都江堰网页制作以及都江堰网络营销策划等。多年来,我们专注于互联网行业,利用自身积累的技术优势、行业经验、深度合作伙伴关系等,向广大中小型企业、政府机构等提供互联网行业的解决方案,都江堰网站推广取得了明显的社会效益与经济效益。目前,我们服务的客户以成都为中心已经辐射到都江堰省份的部分城市,未来相信会继续扩大服务区域并继续获得客户的支持与信任!
liandong.html
首先要引入jquery.js文件
html
title二级联动/title
head
script src="__PUBLIC__/scripts/jquery.js" type="text/javascript"/script
script type="text/javascript"
$(function(){
$('#AreaId').change(function(){
//获取父类的id
var $id=$('#AreaId').val();
//通过ajax进行传值
$.getJSON('__URL__/liandong',{id:$id},function(data){
//回调函数
if (data.status==1){
//首先清除子类中值不为空的,如果没有这句话你会发现子类的显示会这个增加,二不是你想要的结果
$('#ServerId option[value!=""]').remove();
//计算返回数组的数目,并循环显示
for (var i=0;i=data.data.length;i++) {
//定义html标签,和显示的值,id和type_name为数据库中的字段名
var option ="option value="+data.data[i].id+""+data.data[i].type_name+"/option";
//显示的位置
$(option).appendTo('#ServerId');
}
}
});
});
});
/script
/head
body
select id="AreaId" name="AreaId"
option selected="selected" value=""请选择游戏区/option
?php
//循环显示父类
foreach($plei as $val){
?
option value="{$val[id]}"{$val[type_name]}/option
?php
}
?
/select
select id="ServerId" name="ServerId"
option selected="selected" value=""请选择游戏服/option
/select
/body
/html
php文件
IndexAction.class.php
class IndexAction extends Action {
public function liandong(){
//实例化数据表
$type=M('Type');
//首先是查询类别表中的父类,我的是父类的pid都为0
$plei=$type-where('pid=0')-select();
//分配变量
$this-assign("plei",$plei);
//这个主要是判断父类的内容是否发生变化,此判断非常重要(ps:我那会没写这个判断,总是出错,非常头疼)
if($_GET[id]){
$sel=$type-where('pid='.$_GET[id])-select();
$this-ajaxReturn($sel,'子类',1);
}
$this-display();
}
}
12345678910phpfunction ajax_get_b(){ $aid = $_GET['aid']; if( ! $aid ) return false; $res = array();获取二级数据//"select * from table where aid = {$aid}" $str = "select"; foreach($res as $v) $str .= "option$v['name']/option"; $str .= "/select"; }1html+jquery:
select
id="sa"
optiona/option
optionb/option
optionc/option
optiond/option
/select
div
id="sb"
/div
$('#sa').change(function(){
var
url
=
'';
var
aid
=
$(this).val();
$.get(url,{aid:aid},function(str){
$('#sb').html(str);
});
});
function Opt_Sel($table,$id,$name,$postid){
$query=mysql_query("select * from $table");
while($row=mysql_fetch_array($query)){
$selected = $row[$id]==$postid ? "selected" : null;
echo "option value=\"$row[$id]\" $selected$row[$name]/option";
}
}
调用时把以下两句分别放在大小类中.
Opt_Sel('大类表名','大类字段id','大类字段name',你要修该的大类字段id值);
Opt_Sel('小类表名','小类字段id','小类字段name',你要修该的小类字段id值);
上面说的没错。具体流程如下:一级下拉框选择其中一个值时,触发事件,通过ajax讲选择的值进行sql查询,将返回的结果通过js写入到第二级下拉框中