我想在单选按钮的操作上禁用/启用我的日期选择器,但它不起作用

时间:2016-03-22 04:55:31

标签: jquery

这是我的

<script>
    $(document).ready(function(){
        $('input[type=radio][name=test1]').click(function(){
            var related_class=$(this).val();
            $('.'+related_class).prop('disabled',false);

            $('input[type=radio]  [name=test1]').not(':checked').each(function(){
                var other_class=$(this).val();
                $('.'+other_class).prop('disabled',true);
            });
        });
    });
</script> 

这是html

  <label for="radio10"> <input type="radio"name="test2" value="radio10" /> Fixed Date
  </label>
From <input id="one" class="datepicker" type="text" readonly="false" name="for_radio10[]" class="radio10"disabled="false"> 
To <input id="two" class="datepicker" type="text" readonly="true" name="for_radio10[]" class="radio10"disabled="true">

1 个答案:

答案 0 :(得分:0)

如果您希望2个类使用单个属性并使用class

之类的空格分隔它们,那么对于datepicker元素,您有2组class="datepicker radio10"属性

&#13;
&#13;
jQuery(function($) {
  $('.datepicker').datepicker({
    buttonImage: "//placehold.it/16",
    showOn: 'both',
    disabled: true
  });

  $('input[type=radio][name=test1]').click(function() {
    var related_class = $(this).val();
    $('.' + related_class).prop('disabled', false).datepicker("option", "disabled", false);

    $('input[type=radio][name=test1]').not(':checked').each(function() {
      var other_class = $(this).val();
      $('.' + other_class).prop('disabled', true).datepicker("option", "disabled", true);
    });
  });
});
&#13;
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/redmond/jquery-ui.css" rel="stylesheet" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>
<label for="radio10">
  <input type="radio" name="test1" value="radio10" />Fixed Date
</label>
<label for="radio11">
  <input type="radio" name="test1" value="radio11" />Date Range
</label>

From
<input id="one" class="datepicker radio10" type="text" readonly="false" name="for_radio10[]" disabled="false">To
<input id="two" class="datepicker radio10" type="text" readonly="true" name="for_radio10[]" disabled="true">
&#13;
&#13;
&#13;