憨厚生

----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 二胡閱讀(132) | 評論 (0) | 編輯收藏

僅列出標題

憨厚生

公告

常用鏈接

留言簿(6)

隨筆分類(185)

隨筆檔案(165)

文章檔案(17)

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

搜索

積分與排名

最新評論

閱讀排行榜

評論排行榜