日期:2014-05-16  浏览次数:20483 次

select下拉框的问题
两个select下拉框 实现根据s1的下拉选项控制s2可不可选
如下代码:
html:
<td><select id='s1' onchange='s1OnChange(this);'><option>可选</option><option>不可选</option></select></td>
<td><select id='s2'><option>No</option><option>Yes</option></select></td>


js:
function s1OnChange(itemObj) {
    var selectIndex = itemObj.getAttribute("selectedIndex");
    if (selectIndex == 0)  //可选
    {
        document.getElementById("s2").setAttribute("disabled", "true");
    }
    else
    {
        document.getElementById("s2").setAttribute("disabled", "false");
    }
}

运行调试看到:selectIndex 取到的是null,document.getElementById("s2").setAttribute("disabled", "false");
找不到对象,菜鸟求指导

------解决方案--------------------
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="jquery-1.6.2.js"></script>
<script type="text/javascript">
function s1OnChange(itemObj) {
    var selectIndex = itemObj.getAttribute("selectedIndex");
    if (selectIndex == 0)  //可选
    {
        document.getElementById("s2").setAttribute("disabled", false);
    }
    else
    {
        document.getElementById("s2").setAttribute("disabled", true);
    }
}

</script>
</head>
<body>
<td><select id='s1' onchange='s1OnChange(this);'><option>可选</option><option>不可选</option></select></td>
<td><select id='s2'><option>No</option><option>Yes</option></select></td>
</body>
</html>