use "input"
1 text
您可以通过多次选择下拉菜单中的项目将它们统统添加到TEXT域中,然后通过action中指定的程序处理。

<html>
<head>
<script language="JavaScript">
function put()
{
option=document.forms[0].dropdown.options[document.forms[0].dropdown.selectedIndex].text
txt=document.forms[0].number.value
txt=txt + option
document.forms[0].number.value=txt
}
</script>
</head>

<body>
<form name="myform" method="post" action="....">
您经常使用:
<select name="dropdown">
<option value="Javascripts">Javascripts</option>
<option value="Java">Java</option>
<option value="ASP">ASP</option>
<option value="Dhtml">Dhtml</option>
<option value="PHP">PHP</option>
<option value="Perl">Perl</option>
</select>
<input type="button" onClick="put()" value="点击这里多重选择" name="button">
<input type="text" name="number">
<input type="submit" name="Submit" value="Submit">
</form>
</body>
</html>

说明:本例通过表单索引forms[0]确定是哪个Form中的元素和值。0表示该页面中的第一个Form,如果在表单前面还有其它的Form,那么只要修改索引值即可。例如:document.forms[1]等。或者干脆使用form的名字,例如:document.myform等。其中myform是表单的name。


2 下拉菜单选项处理
<script language="JavaScript">
function put()
{
option=document.forms[0].dropdown.options[document.forms[0].dropdown.selectedIndex].text
txt=option
document.forms[0].favorite.value=txt
}
</script>

<form name="myform" method="post" action="....">
<select name="dropdown" onChange="put()">
<option>您最喜欢的浏览器是</option>
<option value="ie">Internet Explorer </option>
<option value="netscape">Netscape Navigator </option>
</select>
<input type="text" name="favorite">
<input type="submit" value="submit">
</div>
</form>


3 Checkbox的选择控制技巧
<html>
<head>
<script language="JavaScript">
function check()
{
myselect=document.forms[0].s1
answer=document.forms[0].answer
txt=""
for (i = 0; i<myselect.length; ++ i)
{
if (myselect[i].checked)
{
txt=txt + myselect[i].value + " " //空一个格
}
}
answer.value=txt
}
</script>
</head>
<body>

<form>
请选择如下的商品:<br>
<input type="checkbox"
name="s1" value="咖啡" onclick="check()">咖啡<br>

<input type="checkbox"
name="s1" value="白糖" onclick="check()">白糖<br>

<input type="checkbox"
name="s1" value="葡萄酒" onclick="check()">葡萄酒<br>

<input type="text" name="answer">
<input type="submit" name="submit" value="Order">
</form>

</body>
</html>

注意:每个checkbox选择项目的name值是一样的(本例是s1),这与通常的checkbox不同。

不使用索引直接使用form名字的情况(不同之处用红色表示):
<html>
<head>
<script language="JavaScript">
function check()
{
myselect=document.myform.s1
answer=document.myform.answer
txt=""
for (i = 0; i<myselect.length; ++ i)
{
if (myselect[i].checked)
{
txt=txt + myselect[i].value + " "
}
}
answer.value=txt
}
</script>

</head>
<body>
<form name="myform" method="post" action="......">
请选择如下的商品:<br>
<input type="checkbox"
name="s1" value="咖啡" onClick="check()">
咖啡<br>
<input type="checkbox"
name="s1" value="白糖" onClick="check()">
白糖<br>
<input type="checkbox"
name="s1" value="葡萄酒" onClick="check()">
葡萄酒<br>
<input type="text" name="answer">
<input type="submit" name="submit" value="Order">
</form>
</body>
</html>


4 Radio控制技巧
<html>
<head>
<script language="JavaScript">
function check()
{
browser=document.forms[0].browser
answer=document.forms[0].answer
for (i = 0; i<browser.length; ++ i)
{
if (browser[i].checked)
{
answer.value=browser[i].value
}
}
}
</script>

</head>
<body>

<form>
你喜欢什么浏览器?<br>
<input type="radio" name="browser" onclick="check()" value="Explorer">Microsoft Internet Explorer<br>

<input type="radio" name="browser" onclick="check()" value="Netscape">Netscape Navigator<br>

<input type="text" name="answer">
</form>

</body>
</html>