Question

这里有两个下拉列表

<div class="form-group">
    <label class="col-sm-4 control-label">Car Type</label>
    <div class="col-sm-7">
        <select class="form-control" id="cartype" name="cartype">
           <option value=""> -- Select Type -- </option>
           <option value="Innova">Innova</option>
           <option value="Tata">Tata</option>
           <option value="Mahindra">Mahindra</option>
        </select>
    </div>
</div>

<div class="form-group">
    <label class="col-sm-4 control-label">Rate Type</label>
    <div class="col-sm-7">
        <select class="form-control" id="rate" name="rate" onchange="showdiv()" >
            <option value=""> -- Select Type -- </option>
            <option value="Outstation" name="outstation" id="outstation">Outstation</option>
            <option value="Local" name="local" id="local">Local</option>
        </select>
    </div>

和文本框

<div class="form-group" id="showme" style="display:none;">
    <input type="text" id="txt1" name="txt1">
</div>

我的Javascript

function showdiv(){
  var vehicle = document.getElementById("cartype").value = "Innova || Tata";
  var rate = document.getElementById("rate").value = "Local";   
  document.getElementById("showme").style.display = 'block';
}

只有当cartype等于div时，我才需要显示文本框Local。但是，当我选择Rate Type隐藏的div正在显示时。

你能帮我解决代码中的错误吗？

Answer 1

这应该有效：

function showdiv(){
  var vehicle = document.getElementById("cartype").value;
  var rate = document.getElementById("rate").value;

  if ((vehicle == "Innova" || vehicle == "Tata") && rate == 'Local') {
     document.getElementById("showme").style.display = 'block';
  } else {
     document.getElementById("showme").style.display = 'none';
  }
}

Answer 2

试试这个

 function showdiv(){
       if((document.getElementById("cartype").value == "Innova" || document.getElementById("cartype").value == "Tata") &&  (document.getElementById("rate").value == "Local")){
                document.getElementById("showme").style.display = 'block';
       } else {
       document.getElementById("showme").style.display = 'none';
       }


}

从TWO下拉列表中选择值时如何显示div？

2 个答案: