为什么数据角色在Jquery Mobile中不起作用?

时间:2015-05-27 12:50:48

标签: javascript jquery jquery-mobile

您好我有HTML页面,我有日期选择器的输入字段,但日期选择器不工作.Below是我的代码。

<!DOCTYPE html>
<html>
<head>
  <title>welcome</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  	<link href="../CSS/Final_Pages/CSS/tableStyle.css" rel="stylesheet" />  
    <link href="../CSS/tableStyleResponsive.css" rel="stylesheet" />     
    <link href="../CSS/Custom_style.css" rel="stylesheet" />  
    <link href="http://code.jquery.com/mobile/1.4.4/jquery.mobile-1.4.4.css" rel="stylesheet" /> 
    <script src="http://code.jquery.com/jquery-2.1.1.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.4/jquery.mobile-1.4.4.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
 </head>
<body>
  <div data-role="page">
    <form name="Basicinfo" id="Basicinfo" method="post" action="%bind(:11)">
      <div role="main" class="ui-content">
        <!-- Other Information Field Starts-->
        <div data-role="fieldcontain">
          <label id="doblbl">Date Of Birth:</label>
          <input type="text" id="dob" name="dob" value="" data-role="date" />
        </div>
      </div>
    </form>
  </div>
</body>

</html>

1 个答案:

答案 0 :(得分:0)

试试看看:

不确定它是否符合您的要求

&#13;
&#13;
 <div id="indexPage" data-role="page">
   <input type="date" id="date_val" data-role="datebox" style="margin-top: 10px" data-options='{"mode": "calbox", "useNewStyle":true,"useFocus": true}'>
</div>

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">

<script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.core.min.js"></script>
<script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.calbox.min.js"></script>
<script type="text/javascript" src="  http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.datebox.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.min.css" />
    
&#13;
&#13;
&#13;