活动公告当前位置:菲娱2 > 活动公告 > >

恒行注册官网:Javascript Select操作大集合

  

[Javascript,Select]Javascript Select操作大集合

  其实这本书一直都在我的电脑里,只是没认真看过。一直没怎么很正式的学习过javascript,偶尔用到的时候就到网上找些代码,改吧改吧就用了,这次从头开始学起,细细看下来,还真是有不少收获,甚至有点喜欢上javascript了。

  
现在步入正题,看到书中讲Form元素的操作,像Textbox、Button、Label等,都还是比较简单的,只是看到Select时,稍微有些复杂,于是就想仔细研究研究,于是就有了这篇文章。Select的操作包括动态添加、删除、移动、获取选中项的值、排序等等,现在一一讲述。

  
1、向Select里添加Option  
代码如下:

  
//IE only,FF不支持Add方法  
function fnAddItem(text,value)  
{  
var selTarget = document.getElementById("selID");  
selTarget.Add(new Option("text","value"));  
}  
//IE FF both OK  
function fnAdd(oListbox, sName, sValue)  
{  
var oOption = document.createElement("option");  
oOption.appendChild(document.createTextNode(sName));  
if (arguments.length == 3)  
{  
oOption.setAttribute("value", sValue);  
}  
oListbox.appendChild(oOption);  
}  
  
2、删除Select里的Option  
代码如下:
  
function fnRemoveItem()  
{  
var selTarget = 恒行注册官网 document.getElementById("selID");  
if(selTarget.selectedIndex > -1)  
{//说明选中  
for(var i=0;i{  
if(selTarget.options[i].selected)  
{  
selTarget.remove(i);  
i = i - 1;//注意这一行  
}  
}  
}  
}  
  
3、移动Select里的Option到另一个Select中  
代码如下:
  
function fnMove(fromSelectID,toSelectID)  
{  
var from = document.getElementById(fromSelectID);  
var to = document.getElementById(toSelectID);  
for(var i=0;i{  
if(from.options[i].selected)  
{  
to.appendChild(from.options[i]);  
i = i - 1;  
}  
}  
}  
  
if 里的代码也可用下面几句代码代替  
代码如下:
  
var op = from.options[i];  
to.options.add(new Option(op.text, op.value));  
from.remove(i);  
  
4、Select里Option的上下移动  
代码如下:
  
function fnUp()  
{  
var sel = document.getElementById("selID");  
for(var i=1; i < sel.length; i++)  
{//最上面的一个不需要移动,所以直接从i=1开始   (责任编辑:admin)

上一篇:JSON.parse()和JSON.stringify()使用介绍

下一篇:Jquery实现仿新浪微博获取文本框能输入的字数代

推荐内容

  • 共3页:
  • 上一页
  • 1
  • 2
  • 3
  • 下一页
  • 客户服务热线

    010-400-12345

    在线客服