第一次点击时没有显示日期选择器

Question

我正在尝试将Jquery UI的DatePicker用于文本字段。它没有显示在第一次点击上，但在未聚焦和焦点显示时。 这里是我正在尝试的示例代码。我很困惑为什么它不是第一次。

Html

<tr><td>Text Field:</td><td><input type="text" name="sampleDate" id="sampleDate" onfocus="showDatePicker(this)"/></td></tr>

JavaScript：

function showDatePicker(element)
{   
$(element).datepicker();    
}

Answer 1

尝试在

上更新此解决方案

jsfiddle

对于此解决方案，假设每个字段将显示具有calss“date”的calander，则无需附加onclick事件

<tr>
    <td>Text Field:</td>
    <td>
        <input type="text" name="sampleDate" class="date" id="sampleDate" />
    </td>
</tr>

将事件附加到具有类日期的每个输入元素

$(document).ready(function () {

    $( ".date" ).each(function( index ) {
       $( this ).datepicker();
   });

});

---

尝试onclick事件

onClick="showDatePicker(this)"

轻松解决方案是使用Datepicker

Answer 2

因为在第一次聚焦时，日期选择器没有被定义

这会产生错误

Uncaught excpetion: showDatePicker is not defined

一个简单的解决方案是

$(document).ready(function () {
    $('#sampleDate').datepicker();
});

Fiddle