【问题标题】:Jquery Datepicker - If else conditionJquery Datepicker - If else 条件
【发布时间】:2021-08-26 21:26:00
【问题描述】:

如果输入字母为“A”,则显示选择今天日期的选项;如果输入字母为“B”,则不应显示选择今天日期的选项。

基本上我需要一个 if-else 条件来将 minDate: 0 更改为 minDate: 1,

这里是链接enter link description here

var text = $('.zip-input').val();
       
if(text.toLowerCase().match(/^a|^A/)){
  $("#TstDiv").html("London").css('color','green').fadeIn(100);

 $('#datepicker').datepicker({

      minDate: 0,
      constrainInput: true,
      beforeShowDay: function(date) {
var day = date.getDay();
return [day != 0,''];
}

});
  
    
}else{
$("#TstDiv").html("uk").css('color','green').fadeIn(100);

 $('#datepicker').datepicker({

      minDate: 2,
      constrainInput: true,
      beforeShowDay: function(date) {
var day = date.getDay();
return [day != 0,''];
}
     }); 

}  
  });

【问题讨论】:

    标签: javascript jquery datepicker jquery-ui-datepicker


    【解决方案1】:
    1. 您必须先销毁现有的日期选择器,然后再更新 选项:$("#datepicker").datepicker("destroy");
    2. else 语句中将 minDate 从 2 更改为 1
    3. 您还可以通过仅在输入的第一个字母发生变化时更新日期选择器并使用三级运算符来设置动态值来进一步简化它。

    工作示例:

    var isLondon;
    
    $(".zip-input").on("input", function() {
        var text = $(".zip-input").val();
        var firstLetter = text[0].toLowerCase();
        var currentIsLondon = (firstLetter === "a");
        if (isLondon !== currentIsLondon) {
            isLondon = currentIsLondon;
            $("#TstDiv").html(isLondon ? "London" : "uk").css('color','green').fadeIn(100);
            $("#datepicker").datepicker("destroy");
            $("#datepicker").datepicker({
                minDate: isLondon ? 0 : 1,
                constrainInput: true,
                beforeShowDay: function(date) {
                    var day = date.getDay();
                    return [day != 0, ""];
                }
            });
        }
    });
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
    
    <span id="TstDiv"></span>
    <input type="text" id="autocomplete" maxlength="8" class="zip-input"  placeholder="Enter pincode" />
    <input id="datepicker" placeholder="Select Delivery Date dd/mm/yyyy">

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2019-07-01
      • 1970-01-01
      • 1970-01-01
      • 2011-11-06
      • 2020-09-15
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多