| 通过Select向Input赋值的几种方法 |
|
来源：本站原创 作者：年华 |
时间：2006-05-23 |
浏览：
相关评论 |
报告错误 |
发布文章
|
【字号：大 | 中 | 小】
【背景色 
 】
|
|
以下是我在实际制作表单中的一些总结,虽然都是小CASE，但还是比较实用的，注意灵活运用!
1.将Select的值直接赋给Input
<form name="formname">
<input name="inputname" type="text" value="" size="20" />
<select name="selectname" onchange="document.formname.inputname.value=this.value">
<option value="value0">value0</option>
<option value="value1">value1</option>
<option value="value2">value3</option>
</select>
</form>
2.将Select的值赋给两个Input
因为Select的一个Option值只有一个，因此在生成Select时需要用JS进行分割一下
<script type="text/javascript">
function Change2Input (objSelect,objInput1,objInput2){
if (!objInput1) return;
if (!objInput2) return;
var str = objSelect.value;
var arr = str.split(",");
objInput1.value=arr[0]
objInput2.value=arr[1]
}
</script>
<form name="formname">
<input name="input1name" type="text" value="" size="20" />
<input name="input2name" type="text" value="" size="20" />
<select name="selectname" onchange="javascript:Change2Input(this,document.formname.input1name,document.formname.input2name)">
<option value="站长吧,http://master8.net">站长吧</option>
<option value="phpcms,http://phpcms.cn">phpcms</option>
</select>
</form>
拿上例来说，就可以把网站名和URL分别赋值给两个Input
3.将Select的值用逗号分割赋给Input
最简单的不做任何处理的是:
<form name="formname">
<input name="inputname" type="text" value="" size="20" />
<select name="selectname" onchange="document.formname.inputname.focus(); document.formname.inputname.value = document.formname.inputname.value + this.options[this.selectedIndex].value + ",";">
<option value="value0">value0</option>
<option value="value1">value1</option>
<option value="value2">value3</option>
</select>
</form>
以下是经过处理的，规则是同一Value只能出现一次，且结尾不要加逗号
<script type="text/javascript">
function ChangeInput (objSelect,objInput){
if (!objInput) return;
var str = objInput.value;
var arr = str.split(",");
for (var i=0; i<arr.length; i++){
if(objSelect.value==arr[i])return;
}
if(objInput.value=='' || objInput.value==0 || objSelect.value==0){
objInput.value=objSelect.value
}else{
objInput.value+=','+objSelect.value
}
}
</script>
<form name="formname">
<input name="inputname" type="text" value="" size="20" />
<select name="selectname" onchange="javascript:ChangeInput(this,document.formname.inputname)">
<option value="value0">value0</option>
<option value="value1">value1</option>
<option value="value2">value3</option>
</select>
</form>
|
|
 |
| |
|
|
|
|
收 藏
投 稿
繁 体
RSS 
欢迎在本站发布信息，在线投递稿件
我要投稿
打印本文
推荐本文
加入收藏
返回顶部
关闭窗口
