重庆分公司,新征程启航
为企业提供网站建设、域名注册、服务器等服务
解决思路:将查询结果,遍历赋值给下拉框的option/option即可;
创新互联公司专注于沙雅企业网站建设,响应式网站建设,电子商务商城网站建设。沙雅网站建设公司,为沙雅等地区提供建站服务。全流程按需开发网站,专业设计,全程项目跟踪,创新互联公司专业和态度为您提供的服务
//数据库查询
$list=$this-db-GetList("select * from `goods_list`");
//循环
$html="select";
foreach ($list as $item){
$html.="option value =\"{$item['cateid']}\"{$item['title']}/option";
}
$html.="/select";
echo $html;
js、ajax实现
seelect id="one"/select!--第一个下拉框--
seelect id="two"/select!--第二个下拉框--
script
$(function(){
$('#one').on('chenge', function(){
var val = $(this).val();
$.get('查找第二个下拉框的方法', {'val' : val}, function(arr){
var text = 'option请选择option';
// 返回一个带有第二个下拉框的json串
$.each(arr, function(i ,o){
text += 'option value="' + o.value + '"' + o.title + 'option';
})
$('#two').empty().append(text);
})
})
})
/script
这种功能主要属于前端范筹,和php关联不大。
思路是用js实现,绑定选择框的change事件,然后ajax获取第二个选择框的列表。
当第二个选择框触发change事件,就ajax加载列表,把相关的参数传到后端,获取数据后再输出到页面。
推荐使用jQuery库,它的html处理,和ajax都很方便新人上手。
关键点:后端需要配合输出json格式数据,方便解析.
如:
$subcates=[
['id'=1,'name'='aaa'],
['id'=2,'name'='bbb'],
];
echo json_encode([ 'code'=1,'result'=$subcate ],JSON_UNESCAPED_UNICODE);
前端jQuery获取数据
$.ajax({
url:'getsubcate.php?bigcate=1',
dataType:'JSON',
success:function(json){
console.log(json.result);
//此处将result数组拼接成html放入第二个选择框
}
});
获取列表的操作类似。
另外,如果对这种动态页面感兴趣的话,可以学习下Vue或React 这些前端框架。只需专注数据,不需要处理html.
上面那个下拉没必要做成超链接查询吧,这个就是弄成最基础的form表单提交查询。
select选择下拉,值就是北京上海。选择一个,查询出这个的数据。
那你非要超链接就这样弄
select onchange="window.location=this.value;"
option value="a.html"北京/option
option value="b.html"上海/option
/select
直接选择就跳转