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中的日期选择控见了。
    以上的这个思路,还是适合于跨浏览器中的一些判断和设置的。

  

你可能感兴趣的:(jquery,UI,Opera,firefox)