作者MOONRAKER (㊣康少校是死到哪里去了)
看板PHP
标题Re: [请益] 请教各位高手关於两阶层下拉选单疑问
时间Thu Jun 21 00:06:06 2012
不想用Ajax，也可以先读出来，然後偷偷藏在网页里面
当然你一定得用javascript, jquery更好
假设你有以下连动的两个select
<select id="trip">
<option value="">请选择</option>
<option value="rail">火车</option>
<option value="bus">国道客运</option>
<option value="air">飞机</option>
</select>
<select id="trip_option">
</select>
计画是当trip的选取项目改变的时候，trip_option里面的选项也要跟着变
火车，就显示莒光号、自强号、区间车；国道客运，就显示统联、和欣、尊龙；飞机
就…等等。那你可以把这些选项先藏在page里面：
<select id="topt_rail" style="
display: none;">
<option value="topt_rail_0">莒光号</option>
<option value="topt_rail_1">自强号</option>
<option value="topt_rail_2">区间车</option>
</select>
<select id="topt_bus" style="display: none">
<option value="topt_bus_0">统联</option>
<option value="topt_bus_0">和欣</option>
<option value="topt_bus_0">尊龙</option>
<option value="topt_bus_0">国光</option>
</select>
<select id="topt_air" style="display: none">
<option value="topt_air_0">华信</option>
<option value="topt_air_1">立荣</option>
<option value="topt_air_2">复兴</option>
<option value="topt_air_3">远东</option>
</select>
然後当trip的值改变的时候
<script type="text/javascript">
$('#trip").change( function() {
var tval = $('#trip').val();
if (tval == '') {
$( '
#trip_option' ).html('');
}
else {
var topt_id = 'topt_' + tval;
$( '
#trip_option' ).html(
$( '#' + topt_id ).html()
);
}
});
</script>
把对应select里面的选项拿出来，塞到trip_option里面去。
这样就可以因应母select的改变而调整子select的内容。
这个方法很容易配合MVC使用；不用MVC也很容易把php和html分开。
例如
<?php
$trip_options = Array(
'bus' => Array('统联', '和欣', '尊龙', '国光')
, 'air' => Array('华信', '立荣', '复兴', '远东')
, 'rail' => Array('莒光号', '自强号', '区间车')
);
?>
<?php foreach ($trip_options as $tkey => $topts) : ?>
<select id="topt_<?php echo $tkey ?>" style="display: none;">
<?php foreach ($topts as $tnum => $topt) : ?>
<option value="topt_<?php echo $tkey ?>_<?php echo $tnum ?>">
<?php echo $topt; ?>
</option>
<?php endforeach; ?>
</select>
<?php endforeach; ?>
当然你可以用ajax。只是如果你的子选单都很短，那这不失为一个方
法，可以降低网页前後端间通讯的负担。
--
从前有个马铃薯王国 有个高贵伟大的国王
有的人尊敬他 有的人畏惧他 但有个人敢看不起他不只是一条龙
嘿呵 快出动 去征服 去摆平 嘿呵 快出征 去征服那条龙
嘿呵 快出动
(宰了它!轰了它!)嘿呵 快出征 去征服那条龙
:■ Potatoes and Dragons (C)Alphanim France 2004-05 :.
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 218.160.177.60
1F：推 rjackie:但这样从资料库读出的值要如放呢?\ 06/22 00:03
2F：→ MOONRAKER:阿比照$trip_options不就结了 我code通通都给你了咧 06/22 06:02