动态地向一个select框添加内容
来源:互联网 发布:nba2016季后赛数据统计 编辑:程序博客网 时间:2024/04/27 06:49
-----------------------------------------------------------------------------------------
一个select框:
<select name="attachlist" size=5 multiple tabindex="4" style="HEIGHT: 134px; WIDTH: 228px">
<option value="nOT"></option>
</select>
效果:
有一个按钮,一个文本框,
往文本框中输入一些内容,按下按钮,其中的内容就添加到select框中了,可反复操作
请指教!!!
---------------------------------------------------------------
<select name="attachlist" size=5 multiple tabindex="4" style="HEIGHT: 134px; WIDTH: 228px">
<option value="nOT"></option>
</select>
<input onclick="attachlist.options[attachlist.options.length]=new Option('a','a')" value=add type=button>
---------------------------------------------------------------
<script>
// 添加选项
function addOption(pos){
var objSelect = document.myForm.mySelect;
// 取得字段值
var strName = document.myForm.myOptionName.value;
var strValue = document.myForm.myOptionValue.value;
// 建立Option对象
var objOption = new Option(strName,strValue);
if (pos == -1 & pos > objSelect.options.length)
objSelect.options[objSelect.options.length] = objOption;
else
objSelect.add(objOption, pos);
}
// 删除选项
function deleteOption(type){
var objSelect = document.myForm.mySelect;
if(objSelect.options.length>0){
if (type == true)
objSelect.options[objSelect.selectedIndex] = null;
else
objSelect.remove(objSelect.selectedIndex);
}
else
alert("已经没有选项可以删除了!")
}
// 显示选项信息
function showOption(objForm){
var objSelect = objForm.mySelect;
if(objSelect.options.length>0){
document.all.myOptionName.value = objSelect.options[objSelect.selectedIndex].text;
document.all.myOptionValue.value = objSelect.options[objSelect.selectedIndex].value;
}
else
alert("没有选项可以显示!")
}
</script>
<form name="myForm">
<select name="mySelect">
<option value="value1" Selected>HTML</option>
<option value="value2">JavaScript</option>
<option value="value3">VBScript</option>
</select>
<input type="button" onclick="showOption(this.form)" value="显示">
<input type="button" onclick="deleteOption(true)" value="删除">
<input type="button" onclick="deleteOption(false)" value="Remove方法"><br><br>
选项名称 : <input type="text" name="myOptionName" value="CSS"><br>
选项的值 : <input type="text" name="myOptionValue" value="value4">
<input type="button" onclick="addOption(-1)" value="添加">
<input type="button" onclick="addOption(0)" value="插入">
</form>
---------------------------------------------------------------
<select name="attachlist" size=5 multiple tabindex="4" style="HEIGHT: 134px; WIDTH: 228px" id=sel>
<option value="nOT">delopt</option>
</select>
<input type=button onclick=delsel()>
<script>
function delsel()
{
var index;
index=document.all('sel').selectedIndex;
document.all('sel').remove(index);
}
</script>
- 动态地向一个select框添加内容
- 使用jquery给select动态添加内容
- js 向 div 动态 添加 内容 table
- 动态向div内添加标签内容:
- Android 向ListView里动态添加内容
- 向列表框添加内容
- 根据select下拉框选择的值,向form表单添加所要显示的内容的方法
- 向Edit添加内容
- 向一个layout中动态添加一个view
- 将js里的一个数组里面的值动态地添加到一个下拉框中
- JS动态添加select下拉框
- JS动态添加select下拉框
- javascript动态添加select
- js动态添加select
- JQGrid 动态添加 Select
- JavaScript向select下拉框中添加和删除元素
- 向文件末尾添加内容
- Javascript 动态添加&删除列表框内容
- 一缺点
- 大端(Big Endian)与小端(Little Endian)详解
- gcc核心扩展
- Google docs支持上传任何文档包括pdf...Cool!
- option 的经典属性
- 动态地向一个select框添加内容
- Ser-U域离线问题的解决方法
- 记录一下 flash player debug 版的官方下载地址。
- SQL2005连接不上
- IBM DB2 734认证考试准备指南
- [转]崔红保: 图一时之快:手动释放Linux服务器内存
- Gnu autoconf 和 automake
- Mondrian工程构建过程
- B/S系统页面传值的方式比较