如何强制等待 jquery 更改的第二个选择

Question

我有一个文本框和一个 select 框

<input type="text" name="TourDate"  id="TourDate" class="date form-control input-sm" value="">
<select name="TourID" id="TourID" class="form-control">
<option value="1">1</option>
<option value="2">2</option>
</select>

在我输入日期（通过 boostrap 日历）和select 游览后我想刷新页面

$(function(){
    $('.form-control').on('change',function(){
        keyword = '_kfnTourID:equal:'+$('#TourID').val()+'|';
        keyword += '_kfdTourDate:equal:'+$('#TourDate').val();
        window.location.href = "{{ url('bookings?search=') }}"+keyword ;
    })
})

但是它在我 select 日期后刷新页面你能告诉我如何强制等待第二个 selection 吗？同时刷新我想在屏幕上显示 loading... 直到刷新完成。我是新手，非常感谢您的帮助。

Answer 1

您需要验证具有 class form-control 的每个字段，如果其中一个未设置，则只需 exit 使用 return。如下所示。

$(function(){
    $('.form-control').on('change',function(){
       if($('#TourDate').val()=="" || $('#TourID').val()==0){
            return;///it exit the execution of code below it
          }
        keyword= '_kfdTourDate:equal:'+$('#TourDate').val();
        keyword+= '_kfnTourID:equal:'+$('#TourID').val()+'|';

        window.location.href = "{{ url('bookings?search=') }}"+keyword ;
    });
});

$(function(){
    $('.form-control').on('change',function(){
       if($('#TourDate').val()=="" || $('#TourID').val()==0){
            return;///it exit the execution of code below it
          }
        keyword= '_kfdTourDate:equal:'+$('#TourDate').val();

        keyword+= '_kfnTourID:equal:'+$('#TourID').val()+'|';

        window.location.href = "{{ url('bookings?search=') }}"+keyword ;
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="TourDate"  id="TourDate" class="date form-control input-sm" value="">
<select name="TourID" id="TourID" class="form-control">
<option value="0">Select</option>
<option value="1">1</option>
<option value="2">2</option>
</select>

如何强制等待 jquery 更改的第二个选择

how to force to wait for the second selection on jquery change

javascript

jquery

refresh

onchange