选择列表框以更改其他输入

Question

我正在选择列表框值，它必须在选择其他输入时显示它可能是文本框或列表框...任何其他的东西...所以我已经通过java脚本通过可见性尝试了功能，但不幸的是它不起作用..可以检查它...... ??

CSS：

.hidden{
    display: none;
}

JS：

function getValue(ev){ 
  var x=document.getElementById("sel");
  var A=document.getElementById("a").value();
  var B=document.getElementById("b").value();
  var C=document.getElementById("c").value();

  for (var i = 0; i < x.options.length; i++) 
  {
     if(x.options[i].selected ==true)
     {
         if(x.options[i].value == "item")
         {
             A.style.display = 'block';
             B.style.display = 'none';
             C.style.display = 'none';
         }
         if(x.options[i].value == "main") 
         {   
             A.style.display = 'none'; 
             B.style.display = 'block';
             C.style.display = 'none';
         }
         if(x.options[i].value == "sub") 
         {
             A.style.display = 'none';
             B.style.display = 'none';
             C.style.display = 'block';
         }
         if(x.options[i].value == "select") 
         {
             A.style.display = 'none';
             B.style.display = 'none';
             C.style.display = 'none';
         }   

       }
  }
}

var sel = document.getElementById('sel');

sel.addEventListener('change', getValue, false );

HTML：

<select id="sel">
   <option value ="select">--Select--</option>
   <option value ="item">Item Type Analysis</option>
   <option value ="main">Main Group Analysis</option>
   <option value ="sub">Sub Group Analysis</option>
</select>
<div id="a" class="hidden">
   <input type="textbox" name="item" id="item"/>
</div>
<div id="b" class="hidden">
   <input type="textbox" name="main" id="main"/> 
</div>
<div id="c" class="hidden">
   <input type="textbox" name="maingroup" id="maingroup"/> 
   <input type="textbox" name="subgroup" id="subgroup"/> 
</div>

Answer 1

错误1

var A=document.getElementById("a").value();
var B=document.getElementById("b").value();
var C=document.getElementById("c").value();

value() 不是一种方法，必须 value 。

错误2

你在循环中

A.style.display = 'none';
B.style.display = 'none';
C.style.display = 'block';

而您已声明A，B和C变量以保存值而不是元素 。将其更改为

var A=document.getElementById("a");
var B=document.getElementById("b");
var C=document.getElementById("c");

选中此fiddle