jqueryMoble demo

日历

 

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<meta charset="gbk">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/jquery.mobile-1.1.1.min.css" rel="stylesheet" type="text/css" />
<link href="css/jquery.mobile-1.1.1.css" rel="stylesheet" type="text/css" />
<link type="text/css" href="http://dev.jtsage.com/jQM-DateBox2/css/demos.css" rel="stylesheet" />
<link href="css/jqm-datebox-1.1.0.comp.calbox.css" rel="stylesheet" type="text/css" />
<!-- NOTE: Script load order is significant! -->
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery.mobile-1.1.1.js" type="text/javascript"></script>
<script type="text/javascript" src="http://dev.jtsage.com/jquery.mousewheel.min.js"></script>
<script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.core.min.js"></script>
<script src="js/jqm-datebox-1.1.0.comp.calbox.js" type="text/javascript"></script>

<script src="js/jquery.mobile.subpage.js" type="text/javascript"></script>
<script>
window.location.href = "page-template.html";
</script>
</head>

<body>
<div data-role="page" id="foo">
<div data-role="content">

　　　　　　 <div class="content-primary">
                <div data-role="collapsible-set" data-mini="true" data-theme="c" data-content-theme="d">
                    <div data-role="collapsible" data-collapsed="false">
                        <h3>
                            Modes Available</h3>
                        <div data-role="fieldcontain">
                            <label for="mode2">
                                设置日期</label>
                            <input name="mode2" id="mode2" type="text" data-role="datebox" data-options='{"mode":"calbox", "useNewStyle":true}' />
                        </div>
                    </div>
                </div>
            </div>

</div>
</div>
</body>
</html>

执行效果代码:

 

posted on 2012-07-30 13:24  djy_fn  阅读(426)  评论(0)  编辑  收藏  举报

导航