Question

我有一个保存按钮，下拉动态会动态生成。当用户选择下拉时，一个值保存按钮被禁用如何？我已经尝试使用css（显示：无），jquery（attr）选项不能正常工作，请另外一种方法吗？

$(document).ready(function() {
  $(document).on("change", "select[id^='dropdown_status']", function() {
    var status_value = $(this).val();
    if (status_value == '2' || status_value == '3') {
      //button disable code
      //css code not working
      $(.submit).css('display', 'none');
      $('.submit').hide();
      //jquery code not working 
      //$(':input[type="submit"]').prop('disabled', true);
      //$(":submit").attr("disabled", true);
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="status" id="dropdown_status414938923" size="1" tabindex="-1" title="" style="display: none;">
    <option value="1">Apple</option>
    <option value="2">Grapees</option>
    <option value="3">mango</option>
    </select>
<input type="submit" class="submit" name="update" value="Save">

Answer 1

使用prop disabled进行停用，使用addClass进行隐藏。

＆＃13;

// If only want to disable
$('.submit').prop('disabled',true);
//if want to hide
$('.submit1').addClass('hide');

＆＃13;

.hide{
  display:none
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="submit" class="submit" name="update" value="Save">
<input type="submit" class="submit1" name="update" value="Save">

＆＃13;

Answer 2

$('select').on('change', function() {

  if (this.value == '2' || this.value == '3')
    $("input").prop('disabled', true);
  else
    $("input").prop('disabled', false);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="status" id="dropdown_status414938923" size="1" tabindex="-1" title="">
<option value="1">Apple</option>
<option value="2">Grapees</option>
<option value="3">mango</option>
</select>
<input type="submit" class="submit" name="update" value="Save">

Answer 3

<!DOCTYPE html>
<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script>
      $(document).ready(function() {
        $('.dropdownstatus').on('change', function() {
          var status_value = ( this.value );
           if (status_value == '2' || status_value=='3')
          {
           $('.submit').css('display','none');
          }
          else{
           $('.submit').css('display','block');
          }
        });
      });
    </script>
  </head>
  <body>
    <select name="status" class="dropdownstatus" id="dropdown_status414938923" size="1" tabindex="-1"title="">
      <option value="1">Apple</option>
      <option value="2">Grapees</option>
      <option value="3">mango</option>
    </select><br/>
    <input type="submit" class="submit" name="update" value="Save">
  </body>
</html>

隐藏提交按钮

3 个答案: