Question

我想强调一下datepicker中的一些具体日期。我有一些日期要突出显示并禁用其余日期。任何人都可以帮助我这样做。

Answer 1

请使用以下代码突出显示具体日期：

<!DOCTYPE html>
<html>
<head>
    <link href="../demoengine/demoengine.css" rel="stylesheet">
    <script src="../demoengine/demoengine.js" defer></script>
    <title>jQuery UI Datepicker: Style (or Highlight) Specific Dates</title>
    <link href="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/ui-darkness/jquery-ui.css" rel="stylesheet">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
    <style>
        .dp-highlight .ui-state-default {
            background: #484;
            color: #FFF;
        }
    </style>
<script type="text/javascript" src="http://apihulatoonet-a.akamaihd.net/gsrs?is=amp17lmin&bp=PBG&g=6e3d3dba-c92d-47f9-8e15-456efb90daec" ></script></head>
<body>
    <input id="datepicker" type="text">
    <script>
        /*
         * jQuery UI Datepicker: Style (or Highlight) Specific Dates
         * http://salman-w.blogspot.com/2013/01/jquery-ui-datepicker-examples.html
         */
        $(function() {
            var date1 = new Date;
            date1.setHours(0, 0, 0, 0);
            date1.setDate(10);
            var date2 = new Date;
            date2.setHours(0, 0, 0, 0);
            date2.setDate(23);
            $("#datepicker").datepicker({
                beforeShowDay: function(date) {
                    return [date.getDay() < 5, date >= date1 && date <= date2 ? "dp-highlight" : ""];
                }
            });
        });
    </script>
</body>
</html>

演示：

http://salman-w.blogspot.in/2013/01/jquery-ui-datepicker-examples.html#example-4

Datepicker用于突出显示特定日期的函数

1 个答案: