JQuery mobile datepicker不起作用 [英] JQuery mobile datepicker doesn't work

查看:167
本文介绍了JQuery mobile datepicker不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试为HTML,JQuery Mobile使用标准的日期检测器。
但是由于某些原因我尝试的任何版本都不起作用。
我认为这可能是我选择的样式表或JQuery Mobile链接的东西。

I'm trying to use a standard datepicker for HTML, JQuery Mobile. But for some reason any version i try doesn't work. I think it might be something with the stylesheet I have selected or the JQuery Mobile links.

这是代码:

 <!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8" />
    <meta content="text/html; charset=windows-1255" http-equiv="content-type">
     <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" href="/resources/demos/style.css" /> 
     <link rel="stylesheet" type="text/css" href="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.min.css" />   
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css">
       <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js">           </script>
         <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest /jqm-datebox.core.min.js"></script>

        <link rel="stylesheet" href="jquery.ui.datepicker.mobile.css" />
          <script src="jquery.ui.datepicker.mobile.js"></script>

    <script>
      $( document ).bind( "mobileinit", function(){
        .mobile.page.prototype.options.degradeInputs.date = true;});</script>

   <style>
    #activ  { position : absolute ; top : 40px ; right: 100px; background-color:#33CCFF;     text-align:justify; }    
   .container { border:2px solid #ccc; width:150px; height: 100px; overflow-y: scroll;    direction: rtl; }
  .container2 { width:100px; height: 70px; direction: rtl; }
  </style>
    <title></title>

     </head>
    <body>


      <div id="page" data-role="page" data-theme="c">

    <div id="header" data-role="header">

     <h1>Play</h1>


  <!--end of popup window-->
        <p>Date: </p>           <!---need to find jquery mobile datepicker-->
                    <label for="date">Select Date Range:</label>
        <input type="date" name="date" id="date" value=""  />


我过度使用了JQuery链接....
提前感谢。

I think I'm overusing the JQuery links.... Thanks in advance.

推荐答案

你的代码太混淆了。您不需要所有这些链接来使用jQuery手机的简单datetimepicker。

Your code is too confused. You don't need all those links to use a simple datetimepicker for jQuery mobile.

尝试此解决方案:

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8" />
    <meta content="text/html; charset=windows-1255" http-equiv="content-type">
     <meta name="viewport" content="width=device-width, initial-scale=1">

     <link rel="stylesheet" href="jquery.ui.datepicker.mobile.css" />
     <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothnes/jquery-ui.css" />   
   <script src="http://code.jquery.com/jquery-1.9.1.js"></script>

 <script>
$(function() {
$( "#datepicker" ).datepicker();
});
</script>

</head> 
<body>

   <div id="page" data-role="page" data-theme="c">
       <div id="header" data-role="header">
          <h1>Play</h1>
            <p>Date: </p>     
               <label for="date">Select Date Range:</label>
               <input type="date" name="date" id="datepicker" value=""  />

</body>
</html> 

这篇关于JQuery mobile datepicker不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆