jQuery UI日期选择器不起作用

Question

当我单击文本字段时，我使用jquery ui添加日期选择器。 但是它的年和月选择器不起作用。 怎么了

function date() {

                                        $("#dob").datepicker();
                                        $("#dob").datepicker("show");
                                        $("#dob").datepicker({
                                            changeMonth: true,
                                            changeYear: true,
                                            yearRange: "1900:1996"
                                        });


                                    }

我的输入域代码是这样

<input type="text" onclick="date()" id="dob"/>

Answer 1

您无需单击输入就调用函数，而不必每次都绑定datepicker。 同样，只打一个电话就足够了，而不是打三遍。

首次呼叫是使用默认设置绑定日期选择器

$("#dob").datepicker();

第二个调用是显示日期选择器，它不是必需的，因为单击输入时它将自动弹出

$("#dob").datepicker("show");

第三个调用是显示日期选择器以及您的选项，例如显示年份和月份

$("#dob").datepicker({
   changeMonth: true,
   changeYear: true,
   yearRange: "1900:1996"
});

您只需要第三个datepicker调用即可，请使用以下代码

<input type="text" id="dob"/>

jQuery的

$(function(){
    $("#dob").datepicker({
       changeMonth: true,
       changeYear: true,
       yearRange: "1900:1996"
    });
});

演示

Answer 2

您可以通过使用以下代码来实现

     <form>
        <fieldset> 
        <input type="text" id="datepicker"/>  
        </fieldset>
     </form>

脚本如下

    $("#datepicker").datepicker({
      changeMonth: true,
      changeYear: true,
      yearRange: "1900:1996"

    });

的jsfiddle