通过从选择菜单中选择一个选项,如何强制其他选择菜单自动加载特定选项?
我的意思是我有这个PHP代码:
<select id="video_cattegory_main" name="video_cattegory_main" style="display:inline; width:95%">
<?php $query_main_menue = "SELECT video_cattegory_main FROM video_tutorials GROUP BY video_cattegory_main";
$main_menue = mysql_query($query_main_menue, $webiceberg) or die(mysql_error());
while ($row_main_menue = mysql_fetch_assoc($main_menue)) { ?>
<option name="video_cattegory_main" value="<?php echo $row_main_menue['video_cattegory_main']?>" ><?php echo $row_main_menue['video_cattegory_main']?></option>
<?php } ?>
</select>
这个剂量加载从表格到选择菜单的值,我有另一个选择菜单就像这个,但在第二个我希望它根据第一个选择加载。
换句话说,什么是最好的方法,以便在选择菜单中自动选择一个选项时,它会强制另一个选择菜单中的默认值
这可以仅在php中完成,还是需要添加我对
知之甚少的js答案 0 :(得分:0)
是的,你必须为此目的使用javascript。当您在加载页面时加载第二个select-dropdownbox的所有值时,仅Javascript就足够了。
如果第二个下拉框的显示值取决于第一个选择框的选择,那么您可能需要AJAX,例如:当第一个下拉框显示一个国家/地区时,当您选择一个国家/地区时,您希望在该国家/地区之外显示某些城市!
根据您想要在第二个框中选择的内容,第一件事可以很容易地实现。如果您对javascript知之甚少,可以使用例如jquery,这是一个很棒的框架,可以很容易地解决这样的练习!
但为此您必须提供更多信息,了解哪个选择的selectbox 1应该自动选择selectbox 2的哪个选项!
您可以使用jquery的onchange()
(link)函数,例如看看那个简单的example!您可以通过http://api.jquery.com/val/
答案 1 :(得分:0)
您可以在不使用任何Javascript的情况下使用PHP执行此操作,但这意味着您必须刷新页面。我会推荐Javascript。
使用PHP执行此操作的最佳方法是使用一个将数据发布到自身的表单。选择第一个选择框后,应该有一个提交按钮。
然后PHP脚本将检查是否已提交第一个选择。如果已经存在,则将基于来自第一个的值生成第二个。如果没有,表格将在没有第二次选择的情况下输出。
再次Javascript是一个更好的解决方案,因为PHP解决方案会引发其他问题,如处理其他表单变量。
答案 2 :(得分:0)
您需要使用Javascript。
PHP是一种服务器端编程语言。所以PHP代码在之前运行客户端能够看到网页。当网页在客户端可见时,PHP无法修改页面。
Javascript是一种客户端语言。它允许您修改DOM(HTML),而用户仍在查看该页面。
这段代码应该可以帮到你。
<select id="select-0">
<option value="0">a0</option>
<option value="1">a1</option>
<option value="2">a2</option>
<option value="3">a3</option>
</select>
<select id="select-1">
<option value="0">b0</option>
<option value="1">b1</option>
<option value="2">b2</option>
<option value="3">b3</option>
</select>
<script type="text/javascript">
// select a specific element
var element = document.getElementById('select-0');
// add a "listener" that allows you to run code when an event occurs
element.addEventListener('change', function() {
// select-0 is changed, so we wish to change the value of select-1
});
</script>