黑马程序员技术交流社区

标题: 如何分别用Dom和jquery方式获取select标签选中的值 [打印本页]

作者: 李青    时间: 2011-12-7 15:19
标题: 如何分别用Dom和jquery方式获取select标签选中的值
如何分别用Dom和jquery方式获取select标签选中的值
作者: 周文军    时间: 2011-12-7 15:36
1.dom 用getElementByID("selid"),getElementByName("selid")来获取值
2.jquery用可以根据$("#Id").val()来获取值;
作者: 林洲    时间: 2011-12-7 18:50
本帖最后由 林洲 于 2011-12-7 18:56 编辑

select标签  中,有个option子标签,
这个标签中有2个值,一个是用于程序处理的value值,一个是用于显示在option标签中的值
1、要取到标签中的value值,可以通过下边2行代码取到:
var prov = document.getElementById("prov");
var provName = prov.value;
2、要取到标签中显示的text值,可以通过下边2行代码取到
var option1 = document.getElementById("option1");
alert(option1.innerText);


如果你要实现的功能是有两个select标签的下拉列表,选择其中一个下拉列表中的值,另一个标签的值自动填充的,这里给出一个大概的实现方式:
var data = { "广东": ["广州", "佛山", "东莞"], "广西": ["南宁", "桂林", "柳州"], "江西": ["南昌", "上饶", "九江"] };//事先初始化的一些数据
function provChange() {
            //取到两个下拉框
            var prov = document.getElementById("prov");
            var city = document.getElementById("city");

            var provName = prov.value; //取到省级select的key值
            var cities = data[provName]; //根据省级key值取到对应的city值,是个数组***要注意取到的数据的类型,这有助于解决问题***
            //动态的创建第二个下拉框中的option标签
            for (var i = 0; i < cities.length; i++) {
                var option = document.createElement("option");
                option.value = cities;
                option.innerText = cities;
                city.appendChild(option);
            }
        }

知道了DOM的实现了,用jquery来实现就不难了,自己琢磨琢磨吧。




欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2