Question

所以我有一个下拉菜单。此下拉菜单的ID为＆＃34;课程＆＃34;。此下拉列表还有一个附加属性onclick="displayField();

下拉列表有2个选项。

2和3。

现在，我希望隐藏类rsform-block-cotecours1的所有内容，具体取决于选择的选项。

以下是JavaScript：

function displayField()
{
  if(document.getElementById("courses").text == '2';)
  document.getElementsByClassName('rsform-block-cotecours1').style.display="none";

  if(document.getElementById("courses").text == '3';)
  document.getElementsByClassName('rsform-block-cotecours1').style.display="";
}


window.addEvent('domready', function() {
displayField();
});

然而，这不起作用，我也不知道为什么。

Answer 1

这是你在找什么？

小提琴： fiddle

<select id="courses" onchange="ddlChange()">
  <option value="2">2</option>
  <option value="3">3</option>
 </select>

<强>的JavaScript

function ddlChange() {

    if (document.getElementById("courses").value =="2"){
      document.getElementsByClassName('rsform-block-cotecours1')[0].style.display="none";
        alert(document.getElementById("courses").value );
    }     
     if (document.getElementById("courses").value == "3"){
      document.getElementsByClassName('rsform-block-cotecours1')[0].style.display="block";
         alert(document.getElementById("courses").value );
    }     
}

Answer 2

将代码更改为以下内容并进行测试

function displayField()
{
  if(document.getElementById("courses").value == '2';)
  document.getElementsByClassName('rsform-block-cotecours1')[0].style.display="none";

  if(document.getElementById("courses").value == '3';)
  document.getElementsByClassName('rsform-block-cotecours1')[0].style.display="";
}


window.addEvent('domready', function() {
displayField();
});

如果您想访问ext而不是javascript中下拉列表的值，请使用以下代码从下拉列表中访问所选选项的文本

var courseElement = document.getElementById("courses");
var text = "";
if (courseElement.selectedIndex != -1)
{
    text = courseElement.options[courseElement.selectedIndex].text;
}

根据下拉菜单选择显示/隐藏

2 个答案: