Question

我正在使用JQuery Mobile的移动主题日期选择器插件。根据JQuery Mobile Datepicker演示，这是相关代码，它的工作方式与预期一致：

<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="jquery.mobile-1.4.5.min.css"/>
<link rel="stylesheet" href="jquery.mobile.icons.min.css" />
<link rel="stylesheet" href="style.css"/>
<link rel="stylesheet" href="jquery.mobile.datepicker.css"/>
<script src="jquery-1.11.3.min.js"></script>
<script>
    //reset type=date inputs to text
    $( document ).bind( "mobileinit", function(){
        $.mobile.page.prototype.options.degradeInputs.date = true;
    }); 
</script>
<script src="jquery.mobile-1.4.5.min.js"></script>
<script src="jquery.ui.datepicker.js"></script>
<script id="mobile-datepicker" src="jquery.mobile.datepicker.js"></script>
</head>

<body>
  <input id="servicedate" name="servicedate" data-role="date" type="text" />
</body>

上面会生成与＃34; servicedate＆＃34;相关联的风格正确的移动日期拣货机输入如this。

现在，任何与datepicker交互的尝试，例如动态更改任何选项，都会导致它失去其移动样式。在身体的底部，我添加了一个：

<script>
  $("#servicedate").datepicker({ dateFormat: "DD, MM dd yy", }); 
</script>

...现在，虽然选项确实有效，但会生成相当令人不愉快的，没有主题的日期选择器，例如this。

任何有关我所做错事的帮助/指导都将不胜感激。感谢。

Answer 1

您需要在标题中添加对jqueryUI.css的引用

这样的事情：

<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">

我宁愿不必这样做，但这是我开始工作的唯一方法。

（编辑）的

JQuery Mobile datepicker在设置任何选项时失去主题

1 个答案: