加载后以及更改后禁用选择框

时间:2017-10-26 19:52:12

标签: javascript jquery

我有许多选择框,可以在选择类别选项时设置特定的开始和结束时间。但是我已经设法将与on change事件一起运行的函数放在一起,这在我创建事件时非常好,但我想在编辑时也调用它同样的事件。

    $(document).on('change', '#js_sub', function() {
    			var GetValue = $(this).val();
    			var GetSlots = GetValue.charAt(GetValue.length - 1);
      			var shouldEnable = GetSlots == 'Y';
            if (shouldEnable){
    			$("select[name='start_time_hour']:eq(0)").val('09');
    			$("select[name='start_time_minute']:eq(0)").val('30');
    			$("select[name='end_time_hour']:eq(0)").val('15');
    			$("select[name='end_time_minute']:eq(0)").val('00');
          	}
    			$('#js_start_time_hour option:not(:selected)').prop('disabled', shouldEnable);
    			$('#js_start_time_minute option:not(:selected)').prop('disabled', shouldEnable);
    			$('#js_end_time_hour option:not(:selected)').prop('disabled', shouldEnable);
    			$('#js_end_time_minute option:not(:selected)').prop('disabled', shouldEnable);
    		});



   
 <select id="#js_sub">
       <option value="01_Y">Day Slot</option>
       <option value="02_N">Anytime</option>
    </select>
    
    <select id="#js_start_time_hour">
       <option value="06">06</option>
       <option value="07">07</option>
       ...
    </select>
    
    <select id="#js_start_time_minute">
       <option value="00">00</option>
       <option value="05">05</option>
       ...
    </select>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

我还要检查#js_sub值的最后一个字符,看它是Y还是N,这只是我为另一个不相关的脚本调用第二个值的一种方式

关于如何在加载和更改时运行此指南的任何指导都很棒

编辑基于评论:

我根据以下建议做了一些阅读,并将以下内容放在一起,确实有效:

var SlotsFunction = function() {
            var GetValue = $("#js_sub").val();
            var GetSlots = GetValue.charAt(GetValue.length - 1);
            var shouldEnable = GetSlots == 'Y';
            if (shouldEnable){
                $("select[name='start_time_hour']:eq(0)").val('09');
                $("select[name='start_time_minute']:eq(0)").val('30');
                $("select[name='end_time_hour']:eq(0)").val('15');
                $("select[name='end_time_minute']:eq(0)").val('00');
            }
                $('#js_start_time_hour option:not(:selected)').prop('disabled', shouldEnable);
                $('#js_start_time_minute option:not(:selected)').prop('disabled', shouldEnable);
                $('#js_end_time_hour option:not(:selected)').prop('disabled', shouldEnable);
                $('#js_end_time_minute option:not(:selected)').prop('disabled', shouldEnable);
            }

        $(document).ready(SlotsFunction);
        $("#js_sub").change(SlotsFunction);

0 个答案:

没有答案