드롭 다운을 선택한 후 일부 값을 숨기려면 표시하고 나머지를 입력해야합니다.

Question

드롭 다운 메뉴에서 selcted를 선택하면 아래 기능이 올바르게 실행되지만 선택이 필요하므로 any1 선택 도움말이 표시됩니다. 더 많은 열쇠가 있습니다. 당신은 당신이 어떤 수준의 미스 매치를 가지고 있습니다

을 예상대로 문 선정

$(".selcted").change(function() { 
      var selectedEventType = this.options[this.selectedIndex].value; 
      // alert(selectedEventType); 
      if (selectedEventType == "expertise"){ 
       $('.fix').css("display", "block"); 
       $('.Nut').css("display", "block"); 
       $('.pra').css("display", "block"); 
       $('.res').css("display", "block"); 
       $('.equal').css("display", "block"); 
      } else if (selectedEventType == "equal") { 
       $('.fix').css("display", "none"); 
       $('.Nut').css("display", "none"); 
       $('.pra').css("display", "none"); 
       $('.res').css("display", "none"); 
       $('.equal').css("display", "block"); 
      } else if (selectedEventType == "fix") { 
       $('.equal').css("display", "none"); 
       $('.Nut').css("display", "none"); 
       $('.pra').css("display", "none"); 
       $('.res').css("display", "none"); 
       $('.fix').css("display", "block"); 
      } else if (selectedEventType == "Nut") { 
       $('.equal').css("display", "none"); 
       $('.fix').css("display", "none"); 
       $('.pra').css("display", "none"); 
       $('.res').css("display", "none"); 
       $('.Nut').css("display", "block"); 
      } else if (selectedEventType == "pra") { 
       $('.equal').css("display", "none"); 
       $('.fix').css("display", "none"); 
       $('.Nut').css("display", "none"); 
       $('.res').css("display", "none"); 
       $('.pra').css("display", "block"); 
      } else if (selectedEventType == "res") { 
       $('.equal').css("display", "none"); 
       $('.fix').css("display", "none"); 
       $('.Nut').css("display", "none"); 
       $('.pra').css("display", "none"); 
       $('.res').css("display", "block"); 
      } 
     }); 

이 일을해야이

<select class="elect" > 
        <option value="<%= option.val %>"> 
         <%= option.lab %> //values will come into this 
        </option> 
        <% }); %> 
       </select> 

Answer 1

입니다. 당신은 당신의 코드에서 선택이 .selcted 철자가 전화를하지만 HTML은 class="elect"

$(".select").change(function() { 
 
    var selectedEventType = $(this).val() 
 
    console.log(selectedEventType) 
 
    // alert(selectedEventType); 
 
    if (selectedEventType == "expertise") { 
 
    $('.fix').css("display", "block"); 
 
    $('.Nut').css("display", "block"); 
 
    $('.pra').css("display", "block"); 
 
    $('.res').css("display", "block"); 
 
    $('.equal').css("display", "block"); 
 
    } else { 
 
    $('.fix').css("display", "none"); 
 
    $('.Nut').css("display", "none"); 
 
    $('.pra').css("display", "none"); 
 
    $('.res').css("display", "none"); 
 
    $('.equal').css("display", "none"); 
 
    $('.' + selectedEventType).css("display", "block"); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select class="select"> 
 
     <option value="expertise">expertise 
 
     </option> 
 
     <option value="equal">equal 
 
     </option> 
 
     <option value="fix">fix 
 
     </option> 
 
     <option value="Nut">Nut 
 
     </option> 
 
     <option value="pra">pra 
 
     </option> 
 
     <option value="res">res 
 
     </option> 
 
    </select> 
 
    
 
    <div class="fix">fix</div> 
 
    <div class="Nut">Nut</div> 
 
    <div class="pra">pra</div> 
 
    <div class="res">res</div> 
 
    <div class="equal">equal</div>

입니다