Question

我想在JQuery datepicker（http://demos.jquerymobile.com/1.4.5/datepicker/）

中更改日期格式

使用函数dateFormat - http://api.jqueryui.com/datepicker/#option-dateFormat。

<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <link rel="stylesheet" href="http://cdn.rawgit.com/arschmitz/jquery-mobile-datepicker-wrapper/v0.1.1/jquery.mobile.datepicker.css">
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />

        <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
        <script src="http://demos.jquerymobile.com/1.4.5/js/jquery.mobile-1.4.5.min.js"></script>
        <script src="http://cdn.rawgit.com/jquery/jquery-ui/1.10.4/ui/jquery.ui.datepicker.js"></script>
        <script id="mobile-datepicker" src="http://cdn.rawgit.com/arschmitz/jquery-mobile-datepicker-wrapper/v0.1.1/jquery.mobile.datepicker.js"></script>
        <script>
            $("#date").datepicker({
                dateFormat: "dd.mm.yy"
              });
        </script>
    </head>
    <body>
        <input data-role="date" type="text">
    </body>
</html>

为什么它不起作用？

Answer 1

你需要用一个document.ready检查包装你的块，否则它将在dom存在之前执行并且什么也不做。

$( document ).ready(function() {
    $("#date").datepicker({
       dateFormat: "dd.mm.yy"
    });
});

您还需要在输入中添加ID：

<input data-role="date" type="text" id="date">

Answer 2

请参阅此fiddle

您遗失了id的{{1}}属性。由于您将日期选择器初始化为input，因此您必须为您的`输入指定$("#date").datepicker()作为日期。您在这里使用ID Selector。

请查看docs中的jQuery选择器。

<强> HTML

id

<强> JS

<input data-role="date" type="text" id="date">

<强>更新

由于您要在$("#date").datepicker({ dateFormat: "dd.mm.yy" });中加载<script>，因此您必须使用<head>。这是一个updated fiddle。因此，更新后的JS将如下所示

$( document ).ready()

JQuery datepicker - 更改日期格式

2 个答案:

请参阅此fiddle