jQueryMobile的(十五) 日期、时间插件

最新推荐文章于 2018-12-11 17:18:21 发布

游可

最新推荐文章于 2018-12-11 17:18:21 发布

阅读量5.9k

点赞数

分类专栏： jQuery Mobile 文章标签： jquery mobile

本文链接：https://blog.csdn.net/bao990423420/article/details/14056091

版权

jQuery Mobile 专栏收录该内容

22 篇文章 1 订阅

订阅专栏

很多时候填写表单的时候可能会让你填一下日期时间等参数

直接上代码 :

<!DOCTYPE html> 
<html> 
	<head> 
	<meta charset="utf-8">
	<title>Forms</title> 
	<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0;">
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" /> 
	<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
	<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script> 
</head> 
<body> 

<div data-role="page">
	<div data-role="header">
		<h1>HTML5 Dates</h1>
	</div>

	<div data-role="content">
	  <form id="test" id="test" action="#" method="post">
		
	         <label for="time">Time:</label>
	         <input type="time" name="time" id="time"/>
			
	         <label for="dtl">Datetime local:</label>
	         <input type="datetime-local" name="dtl" id="dtl" />
			 			
	         <label for="date">Date:</label>
	         <input type="date" name="date" id="date" />
			
	         <label for="month">Month:</label>
	         <input type="month" name="month" id="month" />
			
	         <label for="week">Week:</label>
	         <input type="week" name="week" id="week" />
			
	         <label for="dt">Datetime:</label>
	         <input type="datetime" name="dt" id="dt" />
		
	  </form>			 			 		 			 
	</div>
</div>

</body>
</html>

截图如下：

<body>
<div data-role="page">
   <div data-role="header"><h1>选择时间</h1></div>
   <div data-role="content" data-theme="e">
     <form id="testform">
       日期：<input type="text" name="date1" 
                    id="date1" readonly="true"/>
       时间：<input type="text" name="date2" 
                    id="date2" readonly="true"/>
     </form>
   </div>
   <div data-role="footer"><h4>©2012 rttop.cn studio</h4></div>
</div>
</body>