0

我有一个工作 jQuery UI DatePicker 脚本,它只显示 WED 和 SAT(见下面的主要脚本)。

我还有一个有效的 jQuery UI DatePicker 脚本,它添加了一个按钮图像来触发 DatePicker(请参阅下面的 TRIGGER SCRIPT)。

如何将触发脚本集成到主脚本中?

我知道这很简单,但是这个新手无法弄清楚语法。对于那个很抱歉....

触发脚本:

<script>
$(function() {
    $( "#datepicker" ).datepicker({
        showOn: "button",
        buttonImage: "css/blitzer/images/calendar.gif",
        buttonImageOnly: true
    });
});
</script>

主脚本:

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Disable Certains Days in a Week using jQuery UI DatePicker</title>
        <link rel="stylesheet" href="css/redmond/jquery-ui-1.8.6.custom.css" type="text/css" />
        <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.8.6.custom.min.js"></script>


        <script type="text/javascript">
        $(function() {
            $("#datepicker").datepicker(
            { beforeShowDay: function(day) {
                var day = day.getDay();
                if (day == 0 || day == 1 || day == 2 || day == 4 || day == 5) {
                    return [false, "somecssclass"]
                } else {
                    return [true, "someothercssclass"]
                }
            }
            });
        });
        </script>
    </head>
    <body>
        <input id="datepicker"/>
    </body>
</html>
4

3 回答 3

1
<input  type="button" name="date" id="popupDatepicker">


/* create an array of days which need to be disabled */
        var disabledDays = ["2-21-2010","2-24-2010","2-27-2010","2-28-2010","3-3-2010","3-17-2010","4-2-2010","4-3-2010","4-4-2010","4-5-2010"];

        /* utility functions */
        function nationalDays(date) {
            var m = date.getMonth(), d = date.getDate(), y = date.getFullYear();
            //console.log('Checking (raw): ' + m + '-' + d + '-' + y);
            for (i = 0; i < disabledDays.length; i++) {
                if(ArrayContains(disabledDays,(m+1) + '-' + d + '-' + y) || new Date() > date) {
                    //console.log('bad:  ' + (m+1) + '-' + d + '-' + y + ' / ' + disabledDays[i]);
                    return [false];
                }
            }
            //console.log('good:  ' + (m+1) + '-' + d + '-' + y);
            return [true];
        }
        function noWeekendsOrHolidays(date) {
            var noWeekend = jQuery.datepicker.noWeekends(date);
            return noWeekend[0] ? nationalDays(date) : noWeekend;
        }

        /* taken from mootools */
        function ArrayIndexOf(array,item,from){
            var len = array.length;
            for (var i = (from < 0) ? Math.max(0, len + from) : from || 0; i < len; i++){
                if (array[i] === item) return i;
            }
            return -1;
        }
        /* taken from mootools */
        function ArrayContains(array,item,from){
            return ArrayIndexOf(array,item,from) != -1;
        }


        /* create datepicker */
        jQuery(document).ready(function() {
            jQuery('#date').datepicker({
                minDate: new Date(2010, 0, 1),
                maxDate: new Date(2010, 5, 31),
                dateFormat: 'DD, MM, d, yy',
                constrainInput: true,
                beforeShowDay: noWeekendsOrHolidays
            });
        });
于 2010-11-27T01:10:13.547 回答
0

在您的主脚本中:

$(document).ready(function(){
       $( "#datepicker" ).datepicker(
              { showOn: "button", 
                buttonImage: "css/blitzer/images/calendar.gif", 
                buttonImageOnly: true});
});
于 2010-11-27T01:11:04.317 回答
-1

找到的解决方案:如何添加 jQuery UI DatePicker Button TRIGGER SCRIPT。

<script type="text/javascript">
  $(function() {
        $( "#datepicker" ).datepicker({
              showOn: "button",
              buttonImage: "css/blitzer/images/calendar.gif",
              buttonImageOnly: true,
              beforeShowDay: function(day) {
        var day = day.getDay();
        if (day == 0 || day == 1 || day == 3 || day == 4 || day == 6) {
            return [false, "somecssclass"]
        } else {
            return [true, "someothercssclass"]
        }
    }
        });
  });
</script>
于 2010-11-28T05:21:58.610 回答