JQuery 输入[类型=日期] 选择器

发布于 2024-12-02 17:45:55 字数 374 浏览 0 评论 0原文

我有一个类型设置为“日期”(html5)的输入:

<input id="Employee_hireDate" class="pickDate" type="date" name="Employee[hireDate]" value="Hire Date" />

当我查看原始源时,类型设置为日期。但是,在 Chrome 开发者工具中它不会显示。当我运行时:

alert($('#Employee_hireDate').attr('type'));

它显示输入类型为未定义。我正在使用谷歌浏览器 v15。

有谁知道为什么 JQuery 找不到选择器?

洛根

I have an input with the type set as "date" (html5):

<input id="Employee_hireDate" class="pickDate" type="date" name="Employee[hireDate]" value="Hire Date" />

When I view the raw source, the type is set as date. However, in Chrome Developer Tools it is not displayed. And when I run:

alert($('#Employee_hireDate').attr('type'));

It shows the input type as undefined. I'm using Google Chrome v15.

Does anyone have an idea of why JQuery can't find the selector?

Logan

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

痴意少年 2024-12-09 17:45:55

你真的不应该这样做。 HTML5 日期有一些非常具体的 UI 和非常具体的 API。例如,以下代码 http://jsfiddle.net/trixta/EAZPN/ 在 Opera 中不起作用如果浏览器已完全实现 type="date",则它将无法在 Chrome 或任何其他浏览器中工作。

如果您想让它以某种方式可行,您必须删除日期并将其替换为类型文本。此外,您必须确保始终使用/生成以下格式的日期值 YYYY-MM-DD。

还有很多其他的事情可以让这一切变得更好。我使用 webshims lib 制作了一个小示例,其中您可以在这里找到:http://jsfiddle.net/trixta/VNuct/

Webshims lib 将隐藏您的原始 type="date" 输入并创建一个无名的新输入,以模仿日期选择器的视觉实现。它还将输入值从一个输入传输到另一个输入,并将该值转换为正确的格式。它还为您提供完整的 HTML5 日期 API:

例如:

$('#Employee_hireDate').prop('valueAsNumber', 1315267200000);
$('#Employee_hireDate').prop('valueADate');

You really should not do this, this way. HTML5 date has some very specific UI and a very specific API. For example the following code http://jsfiddle.net/trixta/EAZPN/ does not work in Opera and it won't be working in Chrome or any other browser, if the browser has implemented type="date" fully.

If you want to make this somehow workable, you have to remove the date and replace it with type text. Additionally you have to make sure, that you always use/generate date-value in the following format YYYY-MM-DD.

There are a lot of other things to make this really good. I have made a small example using webshims lib, which you can find here: http://jsfiddle.net/trixta/VNuct/.

Webshims lib will hide your original type="date" input and creates a nameless new one, to mimic the visual implementation of a datepicker. It also transfers the input's value from one input to another and transforms this value into the right format. It also gives you the full HTML5 date API:

for example:

$('#Employee_hireDate').prop('valueAsNumber', 1315267200000);
$('#Employee_hireDate').prop('valueADate');
孤凫 2024-12-09 17:45:55

如果你从 RC 的评论中查看 JSFiddle,并切换 jQuery 的版本,你会发现只有 jQuery 1.6.2 或更高版本才能得到正确的答案(“日期”)。确保您使用的是最新版本的 jQuery!

If you check out the JSFiddle from RC's comment, and switch versions of jQuery around, you'll find you only get the correct answer ("date") with jQuery 1.6.2 or later. Make sure you're using the latest version of jQuery!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文