Javascript 第二次单击字段时，月份和年份选择器值会发生变化_Javascript_Jquery_Html_Forms

Javascript 第二次单击字段时，月份和年份选择器值会发生变化

javascript jquery html forms

Javascript 第二次单击字段时，月份和年份选择器值会发生变化,javascript,jquery,html,forms,Javascript,Jquery,Html,Forms,我有一些我从这个网站上得到的关于月份和年份日期选择器的代码，我编辑了日期格式（mm/dd/yy），选择这些值效果很好，但是当我点击离开字段并返回到它时，选择器会大大改变日期例如，以下内容使用今天的日期调用选择器，您单击“完成”，将今天的日期放入输入字段，如果您单击“离开”，然后再次单击输入字段，则日期选择器显示的日期为去年的12月，再次执行此操作，并将其设置为前一年的12月，以此类推 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transit

我有一些我从这个网站上得到的关于月份和年份日期选择器的代码，我编辑了日期格式（mm/dd/yy），选择这些值效果很好，但是当我点击离开字段并返回到它时，选择器会大大改变日期

例如，以下内容使用今天的日期调用选择器，您单击“完成”，将今天的日期放入输入字段，如果您单击“离开”，然后再次单击输入字段，则日期选择器显示的日期为去年的12月，再次执行此操作，并将其设置为前一年的12月，以此类推

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
    <link rel="stylesheet" type="text/css" media="screen" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/base/jquery-ui.css"/>
    <script type="text/javascript">
    $(function() {
        $('.date-picker').datepicker( {
            changeMonth: true,
            changeYear: true,
            showButtonPanel: true,
            dateFormat: 'dd/mm/yy',
            onClose: function(dateText, inst) { 
                var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                $(this).datepicker('setDate', new Date(year, month, 1));
            },
            beforeShow : function(input, inst) {
                var datestr;
                if ((datestr = $(this).val()).length > 0) {
                    year = datestr.substring(datestr.length-4, datestr.length);
                    month = jQuery.inArray(datestr.substring(0, datestr.length-5), $(this).datepicker('option', 'monthNamesShort'));
                    $(this).datepicker('option', 'defaultDate', new Date(year, month, 1));
                    $(this).datepicker('setDate', new Date(year, month, 1));
                }
            }
        });
    });
    </script>
    <style>
    .ui-datepicker-calendar {
        display: none;
        }
    </style>
</head>
<body>
    <label for="startDate">Date :</label>
    <input autocomplete="off" name="startDate" id="startDate" class="date-picker" />
</body>
</html>


$（函数（）{
$（'.date picker'）。日期选择器（{
变化月：对，
变化年：是的，
showButtonPanel：是的，
日期格式：“日/月/年”，
onClose:函数（dateText，inst）{
var month=$（“#ui datepicker div.ui datepicker month:selected”）.val（）；
var year=$（“#ui日期选择器div.ui日期选择器year:selected”）.val（）；
$（此）.datepicker（'setDate'，新日期（年、月、1））；
},
显示前：功能（输入、安装）{
var-datestr；
if（（datestr=$（this.val（））.length>0）{
年份=datestr.substring（datestr.length-4，datestr.length）；
month=jQuery.inArray（datestr.substring（0，datestr.length-5），$（this.datepicker（'option'，'monthnameshort'））；
$（this）.datepicker（'option'，'defaultDate'，新日期（年，月，1））；
$（此）.datepicker（'setDate'，新日期（年、月、1））；
}
}
});
});
.ui日期选择器日历{
显示：无；
}
日期：

我是JavaScript新手，所以我正在努力找出问题的确切位置。

更改了以下行

month=jQuery.inArray（datestr.substring（0，datestr.length-5），$（this.datepicker（'option'，'monthnameshort'））
要做到这一点，就要选择正确的月份，这样才能发挥作用
month=$（this.datepicker（'getDate'）.getMonth（）