憨厚生

----Java's Slave----
***Java's Host***

BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合

:: 管理 ::

165 随笔 :: 17 文章 :: 90 评论 :: 0 Trackbacks

转动态给select添加选项的常用方法

web开发中，经常需要给select动态添加数据，常用的方法有几种：

1.基于dom方式的添加

2.使用innerHTML添加

3.object方式添加

以下是示例

< html >

< head >

< script >

var city = new Array();

city[ 0 ] = " 西安 " ;

city[ 1 ] = " 乌鲁木齐 " ;

city[ 2 ] = " 西宁 " ;

city[ 3 ] = " 北京 " ;

function objectF()

{

var s = document.getElementById( " object " );

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

{

var option = new Option(city[i],i);

s.options[i] = option;

}

function domF()

{

var s = document.getElementById( " dom " );

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

{

var option = document.createElement( " option " );

var text = document.createTextNode(city[i]);

option.appendChild(text);

option.value = i;

s.appendChild(option);

}

function innerF()

{

var sel = document.getElementById( " inner " );

var str = " <select> " ;

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

{

strstr = str + " <option value=' " + i + " '> " + city[i] + " </option> "

}

strstr = str + " </select> " ;

sel.innerHTML = str;

}

</ script >

</ head >

< body >

< form >

< table >

< tr >

< td >

< select ></ select >

</ td >

< td >

< select ></ select >

</ td >

< td >

< div >

< select ></ select >

</ div >

</ td >

</ tr >

< tr >

< td >< input type = " button " value = " dom " ></ td >

< td >< input type = " button " value = " object " ></ td >

< td >< input type = " button " value = " inner " ></ td >

</ tr >

</ table >

</ body >

posted @ 2007-04-22 16:48 二胡阅读(138) | 评论 (0) | 编辑收藏

仅列出标题

憨厚生

公告

常用链接

留言簿(6)

随笔分类(185)

随笔档案(165)

文章档案(17)

http://www.blogcn.com/u3/19/23/zhjhlz/inde

搜索

积分与排名

最新评论

阅读排行榜

评论排行榜