0

我有一个下拉框，一旦选择它就会显示特定的表单元素，这很完美，但是一旦我将 div 类添加到元素（下拉框），即使未选择该特定元素，css 类仍会显示。

是否可以将 css 类与表单元素一起隐藏，下面是我的代码。

Javascript

   function check() {
var dropdown = document.getElementById("filtercriteria");
var current_value = dropdown.options[dropdown.selectedIndex].value;

if (current_value == "page_name") {
    document.getElementById("contains").style.display = "block";
    document.getElementById("term").style.display = "block";
    document.getElementById("countries").style.display = "none";
    document.getElementById("postcodes").style.display = "none";
    document.getElementById("repeater").style.display = "none";
    document.getElementById("visitor_type").style.display = "none";
    document.getElementById("page_visits").style.display = "none";
    document.getElementById("pvisits_value").style.display = "none";
}

HTML 下拉选择框

 <select id="filtercriteria" onChange="check(this);" >
 <option value="select">Select</option>
 <option value="page_name">Page Name</option>
 <option value="postcode">Postcode</option>
 <option value="country">Country</option>
 <option value="search_term">Search Term</option>
 <option value="referrer">Refferer</option>
 <option value="country">Country</option>
 <option value="search_term">Search Term</option>
 <option value="referrer">Referrer</option>
 <option value="page_visits">Page Visits</option>
 <option value="repeater">Repeater</option>
 <option value="owner">Owner</option>
 <option value="visitor_type">Visitor Type</option>
 </select>

即使未选择此选项，也会显示具有 Div 类的第一个隐藏元素。

 <div id="pagename">
   <div class="select-div">
     <select id="contains" name="contains" display="none" class="hideme">
        <option value="contains">contains</option>
        <option value="exact">exact</option>
     </select>
   </div>
  <input name="term" id="term" type="text" class="hideme" display='none' />

 </div>

任何建议，将不胜感激。

http://jsfiddle.net/isherwood/u2puF/2

4

0 回答 0