`

jquery-ui中的datapicker的跨浏览器判断

阅读更多
  原来发现在chrom,opera等新的版本中,有了type=date类型的日期输入框,
如下图,IE和FIREFOX不行
[img]

http://d2o0t5hpnwv4c1.cloudfront.net/985_datepicker/browser-support.png
[/img]

   那么,可以使用jquery-ui的datapicker依然去做相关的日期控件效果,代码如下:

<link href="css/redmond/jquery-ui-1.8.13.custom.css" rel="stylesheet" />

<input type="date" name="date" id="date" value="" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script>
   (function() {
      var elem = document.createElement('input');
      elem.setAttribute('type', 'date');

      if ( elem.type === 'text' ) {
         $('#date').datepicker({
            dateFormat: 'yy-mm-dd',
            // defaultDate: +5
            maxDate : +3
         });
      }
   })();

</script>
   这里,为了跟各浏览器兼容,还是在这里先设置了<input type="date" name="date" id="date" value="" />
  然后在JQUERY中,
var elem = document.createElement('input');
      elem.setAttribute('type', 'date');

对这个文本框去设置属性,如果能不能设置成功(证明是非支持日期框的浏览器),
然后则可以使用jquery-ui中的日期选择控见了。
    以上的这个思路,还是适合于跨浏览器中的一些判断和设置的。

  
2
3
分享到:
评论

相关推荐

    jquery-ui.css、jquery-ui.js下载

    在本文中,我们将详细探讨`jquery-ui.css`和`jquery-ui.js`这两个关键文件,并讨论如何在项目中有效地使用它们。 首先,`jquery-ui.css`是jQuery UI的核心样式文件,它包含了所有组件的默认样式和主题。这个文件...

    jquery-ui-1.8.2.custom.min.js,jquery-ui-1.8.4.custom.css

    在实际项目中,`jquery-ui-1.8.2.custom.min.js`和`jquery-ui-1.8.4.custom.css`通常一起使用,以确保JavaScript组件的外观和行为与CSS样式协调一致。然而,需要注意的是,这两个版本相对较旧,可能不包含后来版本中...

    jquery-ui-1.8.16

    jquery-ui-1.8.16jquery-ui-1.8.16jquery-ui-1.8.16jquery-ui-1.8.16jquery-ui-1.8.16jquery-ui-1.8.16jquery-ui-1.8.16jquery-ui-1.8.16jquery-ui-1.8.16jquery-ui-1.8.16jquery-ui-1.8.16jquery-ui-1.8.16jquery-...

    jquery-ui-1.8.16.custom.min.js/jquery-ui-1.8.16.custom.css

    这个压缩包包含两个关键文件:`jquery-ui-1.8.16.custom.min.js` 和 `jquery-ui-1.8.16.custom.css`,这些都是jQuery UI的特定版本,即1.8.16。这个版本在当时是一个广泛使用的稳定版本,提供了丰富的功能和组件。 ...

    jquery-ui-datepicker中文版

    jquery-ui-日期框扩展成时间框 jquery-ui时间框 基于别人的代码进行修改 jquery-ui-1.8.16.custom.css文件末尾加入以下代码 .ui-timepicker-div .ui-widget-header{ margin-bottom: 8px; } .ui-timepicker-div dl{ ...

    jquery插件jquery-ui-1.8.2.custom.min.js

    文件列表中的"jquery-1.4.2.js"和"jquery-1.4.2.min.js"分别是未压缩和压缩版的jQuery 1.4.2,是jQuery UI运行的基础。"jquery-1.4.2-vsdoc.js"是一个用于Visual Studio的文档文件,为开发者提供IDE内的API提示。 ...

    jquery-ui-1.10.2.custom

    在这个主题中,我们将深入探讨的是 `jquery-ui-1.10.2.custom` 版本,这是一个定制化的版本,包含了对 jQuery 1.9.1 的支持。 首先,让我们从 `jquery-ui-1.10.2.custom` 的核心组件开始。这个版本提供了包括但不...

    jquery-ui.min.js

    在本文中,我们将深入探讨jQuery UI的核心功能,尤其是标题所提及的`jquery-ui.min.js`文件,以及其在实际开发中的应用。 首先,`jquery-ui.min.js`是jQuery UI的压缩和优化版本,用于提高页面加载速度并减少网络...

    jquery插件jquery-ui-1.8.18.custom.min.js及css文件

    在本篇文章中,我们将深入探讨其自定义版本 `jquery-ui-1.8.18.custom.min.js` 和相关的 CSS 文件,以理解它们如何协同工作,为网页带来强大的功能和美观的界面。 首先,`jquery-ui-1.8.18.custom.min.js` 是 ...

    jquery-uijquery-ui-1.7.3.custom.zip

    jquery-uijquery-uijquery-uijquery-uijquery-uijquery-uijquery-uijquery-uijquery-uijquery-uijquery-uijquery-uijquery-uijquery-uijquery-uijquery-ui

    jquery-ui-1.11.2日期控件datepicker

    ${ctx}/plugins/jquery-ui-1.11.2/jquery-ui.css" &gt; ${ctx}/plugins/jquery-ui-1.11.2/external/jquery/jquery.js"&gt; ${ctx}/plugins/jquery-ui-1.11.2/jquery-ui.js"&gt; ${ctx}/plugins/jquery-ui-1.11.2/jquery-ui-...

    jquery-ui-1.7.3.custom 完整开发包

    其中,主文件(如 `jquery-ui.js` 或 `jquery-ui.min.js`)包含了所有组件和功能。此外,还可能有按功能分隔的单独文件,如 `draggable.js`、`resizable.js` 等,这些文件分别对应拖放、可调整大小等交互功能。...

    jquery-ui-1.9.2.custom.min.js

    在jQuery UI中,开发者可以根据项目的具体需求选择所需的组件,避免引入不必要的代码,提高页面加载速度。"custom" 表示这个版本是根据特定需求定制的,可能只包含了滑块(Sliders)、日期选择器(Datepickers)、...

    jquery-ui-1.10..3.min.js

    jquery-ui-1.10.3.js 版本 1积分下载 jquery-ui-1.10.3.js 版本 1积分下载 jquery-ui-1.10.3.js 版本 1积分下载

    jquery-ui-1.10.3.min.js

    jquery-ui-1.10.3.min.js

    jquery-ui-1.12.1.custom_jqueryui_

    在标题"jquery-ui-1.12.1.custom_jqueryui_"中,"custom"一词暗示了这是一个自定义版本,意味着开发者可能根据需求选择了特定的组件和主题,以优化项目中的性能和功能。 描述中的"jquery ui 1.12.1 for html"进一步...

    jquery-ui.css

    jquery-ui.css

    jquery-ui-1.10.0.custom.zip

    在 `jquery-ui-1.10.0.custom.zip` 文件中,包含了经过自定义配置后的 jQuery UI 库,这使得开发者可以轻松地裁剪掉不必要或者未使用的功能,减小文件大小,提高网页性能。 三、主要组件介绍 1. **Dialog(对话框...

    插件jquery-ui-timepicker-addon.js

    jquery插件jquery-ui-timepicker-addon.j

    jquery-ui-1.10.4.custom

    这个名为 "jquery-ui-1.10.4.custom" 的压缩包文件,很显然是一个自定义版本的 jQuery UI,版本号为 1.10.4。在本文中,我们将深入探讨 jQuery UI 的核心功能、使用场景以及其自定义版本的特性。 ### jQuery UI 的...

Global site tag (gtag.js) - Google Analytics