如果<select> option.val()为"x"，则不要使用.show() div

Question

单击提交按钮时，如果select选项的值为2-6，则只希望它显示/隐藏div。如果值为1(禁用选项)，我不希望按钮单击来做任何事情。

<select id="brand_bu" name="selected" class="form-control" onchange="panelHeader()">
                    <option value="1" disabled selected>Please Select a Option..</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="6">6</option>
                </select>
<span class="input-group-btn">
                        <button class="btn btn-primary" id="submit" type="button">Refresh Table</button>
                    </span>



$(document).ready(function() {
$("#submit").click(function(){

    $("#hide").hide();
    $("#show").show();

});

})；

这就是我试着用if语句做的事情，但我似乎无法让它发挥作用。

$(document).ready(function() {
$("#submit").click(function() {

    if($("#brand_bu").val() != "1"){

    $("#hide").hide();
    $("#show").show();
      }
});

})；

Answer 1

jsFiddle

$(document).ready(function(){

    $("#submit").prop("disabled",true);
    $("#hide").hide();
    $("#show").hide();
});

$("#brand_bu").change(function(){

    if($(this).val() != 1){
        $("#submit").prop("disabled",false);
    }
    else {
     $("#submit").prop("disabled",true);

    }

})

$("#submit").click(function(){
 $("#hide").show();
    $("#show").show();
})

我更改了你的html代码和js代码。请也检查一下琴弦。

Answer 2

• 你需要那些元素
• 单击选择器是错误的- ID不存在
• 使用.val() 不适用于禁用元素，所以使用selectedIndex()

​

$(document).ready(function() {
  $("#submit").click(function() {
    if ($("#brand_bu").prop('selectedIndex') != "0") {
      $("#hide").hide();
      $("#show").show();
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="brand_bu" name="selected" class="form-control" onchange="panelHeader()">
  <option value="1" disabled selected>Please Select a Option..</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
</select>
<span class="input-group-btn">
                        <button class="btn btn-primary" id="submit" type="button">Refresh Table</button>
                    </span>

<div id='hide'>hide</div>
<div id='show'>show</div>

​