Javascript 顯示表單

2010-04-02 4:51 am
我想設計一個JS的下拉式選單
首先只顯示選單1:
有com跟tw的選項

<select name="select">
<option selected><? echo $s;?></option>
<option>-----</option>
<option >com</option>
<option >tw</option>
</select>

如果選了com就顯示下面這個
<select name="server_com" onChange="MM_jumpMenu('parent',this,0)">
<option selected><? echo $s;?></option>
<option value="">-----</option>
<option value="travian.php?l=com&s=s1">s1</option>
<option value="travian.php?l=com&s=s2">s2</option>
<option value="travian.php?l=com&s=s3">s3</option>
<option value="travian.php?l=com&s=s4">s4</option>
<option value="travian.php?l=com&s=s5">s5</option>
<option value="travian.php?l=com&s=s6">s6</option>
</select>

如果選了tw則顯示
<select name="server_tw" onChange="MM_jumpMenu('parent',this,0)">
<option selected><? echo $s;?></option>
<option value="">-----</option>
<option value="travian.php?l=tw&s=s1">s1</option>
<option value="travian.php?l=tw&s=s2">s2</option>
<option value="travian.php?l=tw&s=s3">s3</option>
<option value="travian.php?l=tw&s=s4">s4</option>
<option value="travian.php?l=tw&s=s5">s5</option>
<option value="travian.php?l=tw&s=s6">s6</option>
</select>

回答 (1)

2010-04-02 8:30 am
✔ 最佳答案
將 server_com 與 server_tw 分別放入<div> 中

<div id="com" style="visibility:hidden;display:none">
<select name="server_com" onChange="MM_jumpMenu('parent',this,0)">
...
</select>
</div>

<div id="tw" style="visibility:hidden;display:none">
<select name="server_tw" onChange="MM_jumpMenu('parent',this,0)">
...
</select>
</div>

select 加入onclick 事件
<select name="select" onclick="showMenu(this)">
<option value="com">com</option>
<option value="tw">tw</option>
</select>

function showMenu(select)
{
var i = select.selectedIndex;
var val = select.options[i].value;

obj = document.getElementById("com");

obj.style.visibility = "hidden";

obj.style.display = "none";


obj = document.getElementById("tw");

obj.style.visibility = "hidden";

obj.style.display = "none";


obj = document.getElementById(val);
obj.style.visibility = "visible";
obj.style.display = "block";
}


收錄日期: 2021-04-26 13:12:42
原文連結 [永久失效]:
https://hk.answers.yahoo.com/question/index?qid=20100401000016KK07046

檢視 Wayback Machine 備份