显示日期选择器时突出显示特定日期

kyo*_*kyo 5 javascript jquery datepicker jquery-ui-datepicker

我有这个简单的日期选择器 jQuery,在我的应用程序中,我的用户可以回到过去,但不能回到未来。我想根据 url 浏览器中的日期参数显示当前日期。

让我们说

var url_string = window.location.href;
var url        = new URL(url_string);
var dateParam  = url.searchParams.get("date"); <<----- current date
Run Code Online (Sandbox Code Playgroud)

我有

$(".clock").click(function() {

    $( "#expiryDate" ).datepicker('setDate', date); <<---- Note here 

    $("#expiryDate").datepicker({
        dateFormat: 'yy-mm-dd',
        defaultDate: date,
        showAnim: "fold",
        gotoCurrent: true,
        maxDate: 0,
        onSelect: function() { 

            var dateSelected = $(this).datepicker('getDate'); 
            dateSelected = moment(dateSelected).format('YYYY-MM-DD');


            // $( "#expiryDate" ).datepicker('setDate', dateSelected);

            playSound('forward');

            if(dateParam == null) {
                var url = document.location.href+"&date="+dateSelected;
            }else {
                var url = document.location.href;
                url = url.replace(dateParam,dateSelected);

            }

            document.location = url;
        }
    });


    $('#expiryDate').datepicker('show');
});
Run Code Online (Sandbox Code Playgroud)

即使是今天05/06/2021,用户也可以回到过去,看看那天发生了什么。所以当用户选择02/03/2021. 我想强调那个日期02/03/2021。似乎只有当我点击我的日期两次时才有效。

注意只有第二次点击3才开始突出显示!

如何让它在第一次点击时突出显示?

Sal*_*ter 0

由于我们的信息很少,所以现在在黑暗中进行拍摄:

根据你的片段:

var dateParam  = url.searchParams.get("date"); <<----- current date
Run Code Online (Sandbox Code Playgroud)

$( "#expiryDate" ).datepicker('setDate', date); <<---- Note here 
Run Code Online (Sandbox Code Playgroud)

问题是您dateParam在使用时定义了date.

很难判断其他代码是否定义了该date变量,但作为初学者,我会确保您的日期设置正确......

console.log(date); // Make sure it logs the correct date.
$( "#expiryDate" ).datepicker('setDate', date); <<---- Note here 
Run Code Online (Sandbox Code Playgroud)