<select id="ddlResourceType" onchange="getvalue(this)">
</select>
动态删除select中的所有options:
document.getElementById("ddlResourceType").options.length=0;
动态删除select中的某一项option:
document.getElementById("ddlResourceType").options.remove(indx);
//就是这句不兼容了,Firefox是不懂 remove 这个方法的,所以会报错了,当然也移除不了了
动态添加select中的项option:
document.getElementById("ddlResourceType").options.add(new Option(text,value));
上面在IE和FireFox都能测试成功,希望以后你可以用上。
其实用标准的DOM操作也可以,就是document.createElement,appendChild,removeChild之类的。
取值方面
function getvalue(obj)
{
var m=obj.options[obj.selectedIndex].value
alert(m);//获取value
var n=obj.options[obj.selectedIndex].text
alert(n);//获取文本
}
后来,发现这篇文章末端的那几句话,觉得可以用dom试试,嗯,果然可行.
var sObj=document.getElementById("ddlResourceType");
sObj.removeChild(sObj.options[indx]);
这样,上面这句就做到兼容了.
[html]
<select id="mysel" name="mysel">
<option value="1">1 xxxxxxxxxx</option>
<option value="2">2 yyyyyyyyyy</option>
<option value="3">3 zzzzzzzzzz</option>
<option value="4">4 wwwwwwwwww</option>
</select>
<button onclick="setSel(3)">设置第3项为选中项</button>
<button onclick="clearSel()">清空选择框</button>
<button onclick="fillSel()">填充选择框</button>
<button onclick="removeSel()">移除第一项</button>
<button onclick="editSel()">修改第一项</button>
<script type="text/javascript">
function setSel(str){
with(document.all){
for(var i=0;i<mysel.options.length;i++){
if (mysel.options[i].value==str){
mysel.selectedIndex=i;
break;
}
}
}
}
function clearSel(){
with(document.all){
mysel.options.length=0;
}
}
function fillSel(){
with(document.all){
mysel.options.length=0;
mysel.options[0] = new Option("1 xxxxxxxxxx","1");
mysel.options[1] = new Option("2 yyyyyyyyyy","2");
mysel.options[2] = new Option("3 zzzzzzzzzz","3");
mysel.options[3] = new Option("4 wwwwwwwwww","4");
mysel.options[4] = new Option("5 aaaaaaaaaa","5");
mysel.selectedIndex = 4;
}
}
function removeSel(){
with(document.all){
mysel.remove(0);
if (mysel.options.length>0){
mysel.selectedIndex=0;
}
}
}
function editSel(){
with(document.all){
if (mysel.options.length>0){
mysel.options[0] = new Option("这是新的第一项","new Value")
mysel.selectedIndex=0;
}
}
}
</script>
[/html]
注:所有内容都从网上收集
分享到:
相关推荐
js控制select选中显示不同表单内容select下拉菜单特效 js控制select选中显示不同表单内容select下拉菜单特效 js控制select选中显示不同表单内容select下拉菜单特效
js控制select相关方法,如,控制选中,动态增加,动态减少,删除等等。web开发利器啊
Js操作Select大全(取值、设置选中等等) Js操作Select大全(取值、设置选中等等)
NULL 博文链接:https://heisetoufa.iteye.com/blog/342829
NULL 博文链接:https://dong717.iteye.com/blog/717875
js控制select属性变化其实很简单,并不需要 $('#goodsNames').selectpicker('render'); $('#goodsNames').selectpicker('refresh'); 来重新渲染只用 $(".selectpicker").selectpicker({ width : 300,
用js控制select的一些比较不错的功能。
添加信息的时候需要选择目录, 这时候,就要做类似于省市联级菜单的效果去给用户选择 ,代码不是特别漂亮,但是简洁,很方便使用 ~ 主要实现方法是 ajax ID去请求子目录, 或者请求父目录,然后用js去控制select。...
本文实例讲述了JS更改select内option属性的方法。分享给大家供大家参考。具体如下: 帮一位友人解决了一个小问题,需求是更改选中选项卡内显示的文本值,新值存放在某个文本框内 初始窗口: <html> <head...
NULL 博文链接:https://javasam.iteye.com/blog/1978459
html中的select标签,也是asp.net中的asp:DropDownList控件,接下来介绍javascript对select标签的控制,感兴趣的朋友可以了解下,或许本文对你有所帮助
本文实例讲述了JavaScript实现通过select标签跳转网页的方法。分享给大家供大家参考,具体如下: 我们经常有遇到需要用select标签跳转到新网页的情况,dw生成的代码太复杂,那么有没有精简的代码得以实现呢?经过...
用js控制select的方法,大家可以参考下
主要是用C# js jquery等方法控制select控件的选择值等
在做项目时我们有时会碰上这样的问题,如何限制select的选择条数,如果光凭借JS,JQ恐怕无法解决该问题 现在我们提供一种解决方法: 用div完全模拟select ( 即用配上CSS和jQuery,来打造出一个仿真的 ),来达到控制条...
有关此组件背后的故事,请观看 Jed 在 React Conf 2019 上的演讲 - 构建 React Select 功能包括: 灵活的数据方法,具有可定制的功能 可扩展的样式 API 与情感 组件注入 API 用于完全控制 UI 行为 可控状态道具和...
主要介绍了js+CSS模拟select控件下拉菜单效果,通过javascript鼠标事件结合css控制实现select下拉菜单效果,整体效果华丽美观,需要的朋友可以参考下
select的操作实现代码。方便控制select的朋友。脚本之家之前提供很多相关的代码。