js中操作Select元素 - JavaScript

笔记分类

网站编程(42)

C#/CSharp(51)

Asp.Net(16)

ASP(7)

PHP(4)

JavaScript(29)

CSS(7)

HTML(10)

WAP(6)

数据库(0)

MSSQL(19)

MySql(5)

Oracle(2)

网站运营(1)

搜索优化(2)

网站推广(1)

电脑ABC(11)

批处理(9)

网络杂文(3)

大杂烩(4)

搜索

最新更新

显示列表

js中操作Select元素2009-05-06

Js 中操作 Select 元素
1.增加项
var objSelect = document.getElementById('ID');
objSelect.options[objSelect.length] = new Option('Key', 'Value');

2.删除被选中的项
objSelect.options[objSelect.selectedIndex] = null;

3.修改被选中的项
objSelect.options[objSelect.selectedIndex] = new Option('Key', 'Value');

4.获取被选中的项的文本
objSelect.options[objSelect.selectedIndex].text;

5.获取被选中的项的值
objSelect.options[objSelect.selectedIndex].value;

6.设置选中的项
objSelect.value = value;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>操作Select元素</title> </head> <body> <select id="IDSelect"><option value="">请选择</option></select> <input type="button" value=" 添加苹果 " onclick="Add('苹果', 'Apple')"/> <input type="button" value=" 添加桔子 " onclick="Add('桔子', 'Orange')"/> <input type="button" value=" 删除 " onclick="Remove()"/> <input type="button" value=" 修改 " onclick="Modify()"/> <input type="button" value=" 苹果 " onclick="SetSelect('Apple')"/> <input type="button" value=" 桔子 " onclick="SetSelect('Orange')"/> <input type="button" value=" 获取值 " onclick="GetValue();"/> <input type="button" value=" 获取文本 " onclick="GetText();"/> <script language="JavaScript"> var objSelect = document.getElementById('IDSelect'); function Add(key, value) { objSelect.options[objSelect.length] = new Option(key, value); } function Remove() { var i = objSelect.selectedIndex; objSelect.options[objSelect.selectedIndex] = null; objSelect.selectedIndex = i - 1; } function GetValue() { alert(objSelect.value); } function GetText() { alert(objSelect.options[objSelect.selectedIndex].text); } function Modify() { var i = objSelect.selectedIndex; objSelect.options[objSelect.selectedIndex] = new Option('修改', 'Modify'); objSelect.selectedIndex = i; } function SetSelect(value) { objSelect.value = value; } </script> </body> </html>

返回摘要 | 分类(JavaScript) | 访问(119) | 编辑