带有文本输入的jQuery Datepicker,不允许用户输入

如何将jQuery Datepicker与文本框输入一起使用:

$("#my_txtbox").datepicker({
  // options
});

这不允许用户在文本框中输入随机文本.我希望当文本框获得焦点或用户点击它时弹出Datepicker,但我希望文本框忽略使用键盘的任何用户输入(复制和粘贴,或任何其他).我想从Datepicker日历中专门填充文本框.

这可能吗？

jQuery 1.2.6
Datepicker 1.5.2

1> Adam Bellair..：

---

您应该能够在文本输入上使用readonly属性,jQuery仍然可以编辑其内容.

---

对于禁用了Javascript的人,我会将输入字段单独留在HTML中,并让jQuery的位置将readonly属性放在页面上加载$(document).ready(function(){$("#my_txtbox").attr 'readOnly','true'); }); 这样,关闭JS的用户仍然可以选择日期

---

这很棒..但Chrome(以及可能的其他浏览器)添加到readonly属性的默认样式真的很不愉快,所以一定要覆盖它

---

我使用光标指针使其看起来可点击``

---

根据WC3 HTML规范,它只有或没有true/false https://www.w3.org/TR/html5/forms.html#the-readonly-attribute

2> 小智..：

---

根据我的经验,我会推荐Adhip Gupta建议的解决方案:

$("#my_txtbox").attr( 'readOnly' , 'true' );

下面的代码不会让用户类型的新角色,但将允许他们删除字符:

$("#my_txtbox").keypress(function(event) {event.preventDefault();});

此外,这将使表单对禁用JavaScript的用户无效:

---

什么并行宇宙人使用常规网站与禁用的JavaScript？

---

由于JavaScript禁用方案,OP应考虑将此标记为答案.

---

在撰写本文时,这是使用jQuery设置readonly属性的首选方法:`$("#my_txtbox").prop('readonly',true)`;

3> Brad8118..：

---

尝试

$("#my_txtbox").keypress(function(event) {event.preventDefault();});

---

这不会阻止某人将值粘贴到文本框中以供将来参考。

4> Adhip Gupta..：

---

如果您在多个地方重复使用日期选择器,那么通过使用类似的东西也很容易通过JavaScript修改文本框:

$("#my_txtbox").attr( 'readOnly' , 'true' );

在您初始化日期选择器的地方之前/之后.

5> 小智..：

---

导致文本框在回发后丢失其值.

你宁愿使用Brad8118的建议,这是完美的.

$("#my_txtbox").keypress(function(event) {event.preventDefault();});

编辑:让IE工作使用'keydown'而不是'keypress'