个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
25
4
<link rel="stylesheet"
href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">
<link rel="stylesheet" type="text/css" href="css/mobipick.css" />
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script
src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<script type="text/javascript" src="js/external/xdate.js"></script>
<script type="text/javascript" src="js/external/xdate.i18n.js"></script>
<script type="text/javascript" src="js/mobipick.js"></script>
<script>
$(document).on("pagecreate", pageselector, function() {
var picker = $("input[type='text']", this);
picker.mobipick();
picker.on("change", function() {
// formatted date, like yyyy-mm-dd
var date = $(this).val();
// JavaScript Date object
var dateObject = $(this).mobipick("option", "date");
});
});
</script>
</head>
<body>
<input type="text" placeholder="Last Service Date">
<input type="submit" value="Book">
<input type="reset" value="Reset">
</body>
I am using Mobipick for date, i have these included files in js and css folder of my project but the calender is not showing up when a touch the date input area on mobile.
I want to add date to my form, I have implementeed it in a project in webstorm through jquery-ui which works fine on the browser but not on mobile
最佳答案
根据您的 fiddle 源更改代码如下。在脚本中包含 jquery 和 jquery 移动库
<link rel="stylesheet" href="http://mobipick.sustainablepace.net/css/mobipick.css" />
<script src="http://mobipick.sustainablepace.net/external/xdate.js"></script>
<script src="http://mobipick.sustainablepace.net/external/xdate.i18n.js"></script>
<script src="http://mobipick.sustainablepace.net/js/mobipick.js"></script>
<div data-role="page" id="index">
<div data-role="main" class="ui-content">
<form action="#" method="POST" id="myForm">
<label for="CustomerName" class="ui-hidden-accessible">Name:</label>
<input type="text" name="CustomerName" id="CustomerName" value="" placeholder="Name"/>
<label for="PhoneNumber" class="ui-hidden-accessible">Phone Number</label>
<input type="text" name="PhoneNumber" id="PhoneNumber" placeholder="Phone Number"/>
<label for="Address" class="ui-hidden-accessible">Address</label>
<input type="text" name="Address" id="Address" placeholder="Address">
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<input type="radio" name="TDI" id="TDI3" value="TDI30" />
<label for="TDI3">TDI 3.0</label>
<input type="radio" name="TDI" id="TDI4" value="TDI42" />
<label for="TDI4">TDI 4.2</label>
</fieldset>
</div>
<label for="RegistrationNumber" class="ui-hidden-accessible">Registration Number</label>
<input type="text" name="Registration Number" id="RegistrationNumber" placeholder="Registration Number"/>
<input type="text" placeholder="Last Service Date" id="sdate"/>
<input type="submit" value="Book"/>
<input type="reset" value="Reset"/>
</form>
</div>
</div>
你的 javascript 代码就像
$(document).on("pagecreate",function(event){
$('#sdate').mobipick({
dateFormat: "MM-dd-yyyy"
});
});
引用这个 FIDDLE
这也是FIDDLE DEMO
关于javascript - JQM 中的日期小部件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23495711/
25
4
0
我需要一些特定于移动设备的样式，类似于 jquery mobile(以及 enyojs、sencha touch 等)提供的样式。特别是，我想使用类似于 jqm 的“linked list”导航样式的
我只想在 collapsiblecol1 之前更改 collapsible col2 的位置。最后的顺序应该是: 1.col2 2.col1 3.col3
我正在尝试在我的第一个 JQM 网站中添加单个条件表单元素 本质上，如果先前选择的值满足预定义的常量，我想添加一个字段。 Item1 Item2 Item3 It
我在前面加上这段代码: Test OFF ON
这个问题在这里已经有了答案: How to change page in jQuery mobile (1.4 beta)? (2 个答案) 关闭 8 年前。 我使用的是 1.4，因此不推荐使用 c
我向 div 容器添加了一个弹出窗口。打开弹出窗口不起作用。 这是我的容器结构: dosn't work either -->
这是一件很奇怪的事情。最后一个按钮总是垂直错位。 http://jsfiddle.net/5u38gf00/ one two
我为单选按钮设置了一个水平对齐的字段，虽然按钮在 iPhone 上显示“恰到好处”，因为它们都在同一条线上而不会中断，但我担心在另一个尺寸的显示器上它会把按钮包起来，看起来很糟糕。 有没有一种简单的方
我有一些基本的 HTML，即； Item1 Item2 Item3 Item4 默认情况下，我将
我仍在研究 JQM，如果这是一个简单的问题，请原谅我。 我正在处理以下 JQM 代码，但我注意到的问题是当我尝试向下拖动文本区域时，它的响应速度似乎有点慢: JQ $(function() {
我对 JQMobile 有疑问。我有两个必须具有相同高度的 div，所以我在周围的 div 上使用了 display: table 并在我的内容周围使用了 display: table-cell。然而
我的 JQM 标题上有多个小的无文本按钮，请参阅下图，在我的 Android PhoneGap 应用程序上。这些按钮在触摸屏设备上很难单击(在桌面浏览器上则很好)。似乎要触发点击事件，我必须点击按钮的
我正在使用 Jquery mobile 作为表单/输入字段集。我需要能够检查字段集中的字段是否完整/具有值。 当可折叠链接关闭时，我需要检测所有字段之一是否有值，如果没有，则应向可折叠链接添加一个类。
我有一个星期几的可折叠集，其中用户的事件表示为可折叠集内的 ListView 。 Sunday
下面的JSFiddle给出了基本的源码: http://jsfiddle.net/vgDwj/6/ Sample
有一个非常小的例子来演示我的 jquerymobile 问题: JSFiddle - http://jsfiddle.net/forrest_gump/Q73Mk/3/ 正如你所看到的，我调用 jqm
我想制作一个全局弹出窗口，这样我就可以从不同的页面访问它。我正在阅读有关此内容的文章，解决方案是将其直接添加到index.html标签中的body标签中，所以我这样做了，现在我可以使用此代码从我的其他
我在 JQuery Mobile 1.4.5 页面中使用以下代码，它显示 jqm 多个自定义选择菜单。 options title o
我正在使用 JQM 1.3.1。我有一个显示元素列表的页面，每个元素旁边都有一个按钮，单击该按钮会显示一个包含一些常规信息的弹出窗口: 重要:我需要弹出窗口出现在按下的按钮旁边 问题是当对象位于页面底
我正在使用 jQuery 移动版。我想要一个固定的标题，我在其中放置标题、菜单按钮、下拉菜单和加载按钮。此结构的目的是在内容区域中加载一个列表，我希望在滚动列表时标题和内容位于固定位置。
我是一名优秀的程序员,十分优秀！