首页 > 解决方案 > 制作 2if(optionValue){ $(".box").not("." + optionValue).hide(); $("." + optionValue).show(); } 其他{ $(".box").hide(); } }); })。改变(); }); function myFuction(){ //获取值 //var selValue = document.getElementById("singleSelectDD").value; var selObj = docume

问题描述

标签: javascripthtml

解决方案


与其拥有$("select").change(function(){,不如拥有$("#MENU").change(function() {,否则它将检测到所有正在更改的选择菜单,而不仅仅是您想要的第一个菜单。

$(document).ready(function() {
  $("#MENU").change(function() {
    $(this).find("option:selected").each(function() {
      var optionValue = $(this).attr("value");
      if (optionValue) {
        $(".box").not("." + optionValue).hide();
        $("." + optionValue).show();
      } else {
        $(".box").hide();
      }
    });
  }).change();
});

function myFuction() {
  var selObj = document.getElementById("MENU");
  var selValue = selObj.options[selObj.selectedIndex].value;
  //Setting Value
  //document.getElementById("valorsel").value = selValue;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<select name="MENU" id="MENU" onchange="myFuction()">
  <option value="" selected></option>
  <option value="1">Area</option>
  <option value="2">Bancos</option>
  <option value="3">CFDI</option>
  <option value="4">Departamentos</option>
  <option value="5">Empresa</option>
  <option value="6">Giro Comercial</option>
  <option value="7">Negocio</option>
</select><br><br>
<p>Texto Global</p>
<input type="text" name="GLOBAL" id="GLOBAL" value="" placeholder="Texto global">
</div>
<div class="1 box">
  <p>Seleccione el Area deseada</p>
  <input type="text" name="Txt_Area" id="Txt_Area" value="" placeholder="AREA">
  <select name="AREA" id="AREA" placeholder="Seleccione Area deseada">
    <option value=" " selected></option>
    <option value="1 ">AREA 1</option>
    <option value="2 ">AREA 2</option>
    <option value="3 ">AREA 3</option>
  </select>


推荐阅读