Question

我有一个值为0,1,2,3,4,5,6,7的选择列表。选择值为0和1我想显示一个div，但是选择值为2,3,4 ，5,6,7我想隐藏那个div。我现在的代码在

之下

HTML

A = np.array([[1,2,3],
              [4,5,6],
              [7,8,9]])

b = np.array([2,3,1])

sums = magic_function() #sums = [3, 15, 7]

的jQuery

<select class="rel_status">
  <option value="0">---</option>
  <option value="1">Single</option>
  <option value="2">In a relationship</option>
  <option value="3">Engaged</option>
  <option value="4">Married</option>
  <option value="5">Separated</option>
  <option value="6">Divorced</option>
  <option value="7">Widowed</option>
</select>

<div class="rel_part">                   
  <input type="text" name="part_name" placeholder="Search">
</div>

当我放

时，代码实际上有效

//hide partner search form
$('.rel_part').hide(); 

//Search Relationship partner
$(document).ready(function(){
  $('.rel_status').change(function(){
    if($('.rel_status').val() == '2','3','4','5','6','7') {
        $('.rel_part').show(); 
    } else {
        $('.rel_part').hide(); 
    } 
  });
});

而不是

.val() == '2')

但后来我无法显示其他值的div

Answer 1

你可以这样做if ($.inArray($(this).val(), "2,3,4,5,6,7") == -1) {

<强>演示

＆＃13;

//hide partner search form
$('.rel_part').hide();

//Search Relationship partner
$(document).ready(function() {
  $('.rel_status').change(function() {
    if ($.inArray($(this).val(), "2,3,4,5,6,7") == -1) {
      $('.rel_part').show();
    } else {
      $('.rel_part').hide();
    }
  });

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="rel_status">
        <option value="0">---</option>
        <option value="1">Single</option>
        <option value="2">In a relationship</option>
        <option value="3">Engaged</option>
        <option value="4">Married</option>
        <option value="5">Separated</option>
        <option value="6">Divorced</option>
        <option value="7">Widowed</option>
    </select>


<div class="rel_part">
  <input type="text" name="part_name" placeholder="Search">
</div>

＆＃13;

Answer 2

使用它会起作用

$('.rel_status').change(function(){
  if($('.rel_status').val() < 2) {
    $('.rel_part').show(); 
  } else {
    $('.rel_part').hide(); 
  } 
});

//hide partner search form
$('.rel_part').hide(); 

//Search Relationship partner
$(document).ready(function(){
  $('.rel_status').change(function(){
    if($('.rel_status').val() < 2) {
      $('.rel_part').show(); 
    } else {
      $('.rel_part').hide(); 
    } 
  });
});

<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<select class="rel_status">
  <option value="0">---</option>
  <option value="1">Single</option>
  <option value="2">In a relationship</option>
  <option value="3">Engaged</option>
  <option value="4">Married</option>
  <option value="5">Separated</option>
  <option value="6">Divorced</option>
  <option value="7">Widowed</option>
</select>

<div class="rel_part">                   
  <input type="text" name="part_name" placeholder="Search">
</div>

Answer 3

这不是将一个值与许多其他值进行比较的有效方法。

if($('.rel_status').val() == '2','3','4','5','6','7')

改为使用逻辑OR运算符：

if($('.rel_status').val() == '0' || $('.rel_status').val() = '1') {
    $('.rel_part').hide(); 
} else {
    $('.rel_part').show(); 
}

请注意，我在if子句中切换了大小写，因此编写的代码更少。

Answer 4

问题是这不是在Javascript中使用,的有效方式，因为您最终会验证if($('.rel_status').val() == '7') {。

您可以将代码更改为此内容 if($.inArray($('.rel_status').val(), ['2','3','4','5','6','7']) != -1) { 它应该工作。

希望它有所帮助！

show hide div基于select option value jQuery

4 个答案: