我没有使用jquery获得月/年滑块

时间:2015-07-30 05:38:33

标签: javascript jquery

我希望在我的网站右侧获得月/年选择器滑块。我从一个网站获得了一个代码。它正在工作,但在我下载后它没有工作。我添加了jquery.js文件夹。它是正确的。请帮助..我的代码是

<script src="jquery.js"></script>
    <script src="jquery.min.js."> 
    $(function() {
        $('.monthYearPicker').datepicker({
            changeMonth: true,
            changeYear: true,
            showButtonPanel: true,
            dateFormat: 'MM yy'
        }).focus(function() {
            var thisCalendar = $(this);
            $('.ui-datepicker-calendar').detach();
            $('.ui-datepicker-close').click(function() {
    var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
    var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
    thisCalendar.datepicker('setDate', new Date(year, month, 1));
            });
        });
    });
           </script>

    <style type="text/css">
    ui-datepicker-calendar {
        display: none;
     }
    </style>
    <label for="myDate">Date :</label>
    <input name="myDate" class="monthYearPicker" />

请help.whicj jquery我必须包括?jquery.js或jquery.min.js?

1 个答案:

答案 0 :(得分:0)

您必须包含正确的文件:

<强> HTML:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<label for="myDate">Date :</label>
<input name="myDate" class="monthYearPicker" />

<强> JS:

$(function () {
    $('.monthYearPicker').datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'MM yy'
    }).focus(function () {
        var thisCalendar = $(this);
        $('.ui-datepicker-calendar').detach();
        $('.ui-datepicker-close').click(function () {
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
            thisCalendar.datepicker('setDate', new Date(year, month, 1));
        });
    });
});

演示:http://jsfiddle.net/lotusgodkk/GCu2D/797/