獲取jquery下拉更改切換顯示不同的字段基於val（）

我試圖讓#org div只顯示在下拉列表中選擇的值「朋友」時顯示（我已經擦洗原始三個詞帶空格的價值，但並不需要它來確定我爲這些目的而工作的地方，但是我提到它以防空間成爲一個問題，我懷疑這一點）。如果下拉列表的值更改爲「朋友」以外的任何內容，請隱藏#org的顯示內容。我認爲這會起作用，並且我已經環顧了各種替代品，但是我撞上了一堵牆。我會欣賞一些額外的眼球來幫助我看看我做錯了什麼。獲取jquery下拉更改切換顯示不同的字段基於val（）

$("#Affiliation").prop("selectedIndex", -1); 
 

 
     $("#Affiliation").change(function() { 
 
      var getVal = $(this).val(); 
 
      console.log(getVal); 
 
      if (getVal == "Friend Of Peirce") { 
 
       $("#org").attr("style", "display:block;"); 
 
      } 
 
      else { 
 
       $("#org").attr("style", "display:none;"); 
 
      } 
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <label>Affiliation</label> 
 
    <div> 
 
     <select id="Affiliation" name="Affiliation"> 
 
      <option value="Student">Student</option> 
 
      <option value="Alumni">Alumni</option> 
 
      <option value="Staff">Staff</option> 
 
      <option value="Faculty">Faculty</option> 
 
      <option value="Friend">Friend</option> 
 
     </select> 
 
    </div> 
 
</div> 
 

 
<div id="org" style="display: none;"> 
 
    <label>Organization</label> 
 
    <div> 
 
     <input id="Organization" name="Organization" type="text" value="" /> 
 
    </div> 
 
</div>

//編輯（添加GETVAL == 「朋友」）的單賦值是一個錯字

來源

2015-08-13 Neurothustra

如果（GETVAL === 「朋友」）{ $（「＃組織」）顯示（）。 } else { $（「＃org」）。hide（）; } –

達伍德 - 添加作爲答案，我會標記它。謝謝。我知道這會很簡單。 – Neurothustra

有點問題，如果條件

$("#Affiliation").prop("selectedIndex", -1); 
 

 
     $("#Affiliation").change(function() { 
 
      var getVal = $(this).val(); 
 
      console.log(getVal); 
 
      if (getVal == "Friend") { 
 
       $("#org").attr("style", "display:block;"); 
 
      } 
 
      else { 
 
       $("#org").attr("style", "display:none;"); 
 
      } 
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <label>Affiliation</label> 
 
    <div> 
 
     <select id="Affiliation" name="Affiliation"> 
 
      <option value="Student">Student</option> 
 
      <option value="Alumni">Alumni</option> 
 
      <option value="Staff">Staff</option> 
 
      <option value="Faculty">Faculty</option> 
 
      <option value="Friend">Friend</option> 
 
     </select> 
 
    </div> 
 
</div> 
 

 
<div id="org" style="display: none;"> 
 
    <label>Organization</label> 
 
    <div> 
 
     <input id="Organization" name="Organization" type="text" value="" /> 
 
    </div> 
 
</div>

來源

2015-08-13 19:12:45

如果條件有問題：

而且使用jQuery hide和show功能：

if (getVal === "Friend") { 
    $("#org").show(); 
} else { 
    $("#org").hide(); 
}

來源

2015-08-13 19:29:32

獲取jquery下拉更改切換顯示不同的字段基於val（）

回答

相關問題