JavaScript之select的总结

      这阵子学习google maps api，其中JavaScript是基础。然而这个基础从来没有接触过，有个面官说两个星期内可以掌握JavaScript，我看JavaScript的书，也确实觉得这东西比ASP.NET好理解，不过实在是自己没有花心思在这一块的学习上，所以发现几个星期下来，我的JavaScript还是毫无进步，哎，看来，还得后续发展啊。。。

     下面这些是我在做google maps api作业时遇到和已经解决了的问题，当然，是很小的问题：

     如何运用下拉框和列表框：

    首先，下拉框和列举框都是属于DOM下的Select对象，在body中就是html文件的窗体标签<select>...</select>中。只是列表框时，要设制其size>1。

     下拉框和列表框中所需要显示的项目，则在标签<option>...</option>中写。

如：

 

1.在代码中（即<script>...<script>）调用如下：

 var mysel=document.getElementById("yourname");

 

2.倘若想要调用的是该下拉框（或列表框）的value值，则

var myval=document.getElementById("yourname").value;

 

 

3.若想检测某个选项是否有选中
if(mysel.selectedIndex > -1) {
//说明选中
} else {
//说明没有选中
}

 

4.动态创建select

function createSelect(){

var mySel= document.createElement_x("select");
mySelect.id = "mySel";
document.body.appendChild(mySel);
}

 

5.添加选项option

function addOption(){

//根据id查找对象，
var mysel=document.getElementById("yourname");

//添加一个选项
mysel.add(new Option("文本","值"));//文本即上述在Body中创建的“项目1”，值即“value”值
}

 

6.删除所有选项option

function removeAll(){
var mysel=document.getElementById("yourname");

mysel.options.length=0;

}

 

7.删除一个选项option

function removeOne(){
var mysel=document.getElementById("yourname");

//index,要删除选项的序号，这里取当前选中选项的序号

var index=mysel.selectedIndex;
mysel.options.remove(index);
}

 

8.获得选项option的值

var mysel=document.getElementById("yourname");

var index=mysel.selectedIndex; //序号，取当前选中选项的序号

var val = mysel.options[index].value;

 

9.获得选项option的文本

var mysel=document.getElementById("yourname");

var index=mysel.selectedIndex; //序号，取当前选中选项的序号

var val = mysel.options[index].text;

 

10.修改选项option

var mysel=document.getElementById("yourname");

var index=mysel.selectedIndex; //序号，取当前选中选项的序号

var val =mysel.options[index]=new Option("新文本","新值");

 

下拉框：<select name="yourname" id="yourid">

             <option value="0">项目1</option>

             <option value="1">项目2</option>

             <option value="2">项目3</option> 

列表框：<select name="yourname" id="yourid" size=5>

             <option value="0">项目1</option>

             <option value="1">项目2</option>

             <option value="2">项目3</option>

 

（P.S以上内容，很多来自网络其他同学的总结。。。）