打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
javascript对下拉列表框(select)的操作

 

<form id="f"> 
<select size="1" name="s"> 
<option value="www.dwww.cn">设计家园</option> 
<option value="baidu.com">百度</option> 
</select> 
</form>

---------------------------------------------------------------------------

<script type="text/javascript"> 
<!-- 
var f = document.getElementById("f");

//获得select列表项数目 
document.write(f.s.options.length); 
document.write(f.s.length);

//当前选中项的下标(从0 开始)(有两种方法) 
//如果选择了多项,则返回第一个选中项的下标 
document.write(f.s.options.selectedIndex); 
document.write(f.s.selectedIndex);

//检测某一项是否被选中 
document.write(f.s.options[0].selected);

//获得某一项的值和文字 
document.write(f.s.options[0].value); 
document.write(f.s.options[1].text);

//删除某一项 
f.s.options[1] = null;

//追加一项 
f.s.options[f.s.options.length] = new Option("追加的text", "追加的value");

//更改一项 
f.s.options[1] = new Option("更改的text", "更改的value"); 
//也可以直接设置该项的 text 和 value 
//--> 
</script>


//全选列表中的项 
function SelectAllOption(list) 

for (var i=0; i<list.options.length; i++) 

list.options[i].selected = true; 

}


//反选列表中的项 
function DeSelectOptions(list) 

for (var i=0; i<list.options.length; i++) 

list.options[i].selected = !list.options[i].selected; 

}


//返回列表中选择项数目 
function GetSelectedOptionsCnt(list) 

var cnt = 0; 
var i = 0; 
for (i=0; i<list.options.length; i++) 

if (list.options[i].selected) 

cnt++; 

}

return cnt; 
}


//清空列表 
function ClearList(list) 

while (list.options.length > 0) 

list.options[0] = null; 

}


//删除列表选中项 
//返回删除项的数量 
function DelSelectedOptions(list) 

var i = 0; 
var deletedCnt = 0; 
while (i < list.options.length) 

if (list.options[i].selected) 

list.options[i] = null; 
deletedCnt++; 

else 

i++; 

}

return deletedCnt; 

//此函数查找相应的项是否存在 
//repeatCheck是否进行重复性检查 
//若为"v",按值进行重复值检查 
//若为"t",按文字进行重复值检查 
//若为"vt",按值和文字进行重复值检查 
//其它值,不进行重复性检查,返回false 
function OptionExists(list, optText, optValue, repeatCheck) 

var i = 0; 
var find = false;

if (repeatCheck == "v") 

//按值进行重复值检查 
for (i=0; i<list.options.length; i++) 

if (list.options[i].value == optValue) 

find = true; 
break; 



else if (repeatCheck == "t") 

//按文字进行重复检查 
for (i=0; i<list.options.length; i++) 

if (list.options[i].text == optText) 

find = true; 
break; 



else if (repeatCheck == "vt") 

//按值和文字进行重复检查 
for (i=0; i<list.options.length; i++) 

if ((list.options[i].value == optValue) && (list.options[i].text == optText)) 

find = true; 
break; 


}

return find; 
}


//向列表中追加一个项 
//list 是要追加的列表 
//optText 和 optValue 分别表示项的文字和值 
//repeatCheck 是否进行重复性检查,参见 OptionExists 
//添加成功返回 true,失败返回 false 
function AppendOption(list, optText, optValue, repeatCheck) 

if (!OptionExists(list, optText, optValue, repeatCheck)) 

list.options[list.options.length] = new Option(optText, optValue); 
return true; 

else 

return false; 

}


//插入项 
//index 插入位置,当插入位置 >= 列表现有项数量时,其作用相当于不进行重复检查的追加项 
//optText 和 optValue 分别表示项的文字和值 
function InsertOption(list, index, optText, optValue) 

var i = 0; 
for (i=list.options.length; i>index; i--) 

list.options[i] = new Option(list.options[i-1].text, list.options[i-1].value); 
}

list.options[index] = new Option(optText, optValue); 

//将一个列表中的项导到另一个列表中 
//repeatCheck是否进行重复性检查,参见OptionExists 
//deleteSource项导到目标后,是否删除源列表中的项 
//返回影响的项数量 
function ListToList(sList, dList, repeatCheck, deleteSource) 

//所影响的行数 
var lines = 0; 
var i = 0; 
while (i<sList.options.length) 

if (sList.options[i].selected && AppendOption(dList, sList.options[i].text, sList.options[i].value, repeatCheck)) 

//添加成功 
lines++; 
if (deleteSource) 

//删除源列表中的项 
sList.options[i] = null; 

else 

i++; 


else 

i++; 

}

return lines; 
}


//列表中选中项上移 
function MoveSelectedOptionsUp(list) 

var i = 0; 
var value = ""; 
var text = ""; 
for (i=0; i<(list.options.length-1); i++) 

if (!list.options[i].selected && list.options[i+1].selected) 

value = list.options[i].value; 
text = list.options[i].text; 
list.options[i] = new Option(list.options[i+1].text, list.options[i+1].value); 
list.options[i].selected = true; 
list.options[i+1] = new Option(text, value); 


}


//列表中选中项下移 
function MoveSelectedOptionsDown(list) 

var i = 0; 
var value = ""; 
var text = ""; 
for (i=list.options.length-1; i>0; i--) 
{


if (!list.options[i].selected && list.options[i-1].selected) 

value = list.options[i].value; 
text = list.options[i].text; 
list.options[i] = new Option(list.options[i-1].text, list.options[i-1].value); 
list.options[i].selected = true; 
list.options[i-1] = new Option(text, value); 


}

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
动态生成select选项全接触
左右表格中内容可调换的代码
一个原创的基于Ajax的通用(组合)查询(续) - 冰戈 - 博客园
javascript 实现左移右移上移下移(厦门_小鱼儿_^1^)
Javascript - Select操作大集合
Javascript操作Select和Option
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服