为什么我不能输入datepicker文本框？

我稍微调整了日期时间选择器的工作原理。 它是在选择更改时触发的。

但现在我无法输入文本框。 我不仅将文本框用于日期时间，还允许用户在我的应用程序中输入其他类型的信息。

如何让用户输入此文本框？ 所以其他所有设置都保持不变。 仅在选择更改时触发Datepicker。 不是单击文本框本身。

jsfiddle样本

HTML代码

  Not this one Not this one Not this one Select date and time ​ 

javascript代码

 $('#datetime').datetimepicker({ showOn: "button", }); $('option[value=datetimepicker]').click(function() { $('#datetime').datetimepicker('show'); });​ 

css代码

 .ui-datepicker-trigger{display:none;}​ 

Answer 1

这个代码默认禁用你的INPUT并从中使用datetimepicker“按钮”，这就是你无法在INPUT字段中打印文本的原因：

 $('#datetime').datetimepicker({ showOn: "button", }); 

让我们进一步看看：

 $('option[value=datetimepicker]').click(function() { // This part of code will work when you click inside SELECT field } 

因此，当您在SELECT中单击时，需要将输入转换为datetimepicker，是吗？

为此，您只需在previouse块中移动datetimepicker的inicialization：

 $('option[value=datetimepicker]').click(function() { $('#datetime').datetimepicker({ showOn: "button", }); $('#datetime').datetimepicker('show'); }); 

现在您可以输入内部输入，直到按下SELECT。 按下SELECT时，datapicker启动，INPUT字段中的文本消失。

这是修改过的小提琴： http ： //jsfiddle.net/dPRjS/9/

---

更新：

要在datetimepicker关闭后添加编辑INPUT的可能性，您需要在字段INPUT上销毁创建的datetimepicker，以使其返回到INPUT可能的工作状态：

单击INPUT字段时需要激活此操作：

 $('#datetime').click(function(){ $('#datetime').datetimepicker( "destroy" ); }); 

工作更新的小提琴： http ： //jsfiddle.net/dPRjS/10/