Question

我陷入了奇怪的问题。
我这样使用datepicker：

<h6>From:</h6>
<input type="text" name="from" data-behaviour='datepicker' data-date-format="yyyy-mm-dd">

<script type="text/javascript">
     $('[data-behaviour~=datepicker]').datepicker();
</script>

本地datepicker工作正常，但上传到heroku日历后没有打开。我在this link中尝试了答案，之后它开始在IE 8上工作。我无法弄清楚问题是什么。请指导我正确的方向。感谢

Answer 1

此代码使用Modernizr来检测是否支持“日期”输入类型。如果它不受支持，则它会回到JQueryUI datepicker。

注意：您需要下载JQueryUI，并可能在您自己的代码中更改CSS和JS文件的路径。

    <!DOCTYPE html>
<html>
    <head>
        <title>Modernizer Detect 'date' input type</title>
        <link rel="stylesheet" type="text/css" href="jquery-ui-1.10.3/themes/base/jquery.ui.all.css"/>
        <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/modernizr/modernizr-1.7-development-only.js"></script>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
        <script type="text/javascript" src="jquery-ui-1.10.3/ui/jquery.ui.core.js"></script>
        <script type="text/javascript" src="jquery-ui-1.10.3/ui/jquery.ui.widget.js"></script>
        <script type="text/javascript" src="jquery-ui-1.10.3/ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript">
    $(function(){
        if(!Modernizr.inputtypes.date) {
            console.log("The 'date' input type is not supported, so using JQueryUI datepicker instead.");
            $("#theDate").datepicker();
        }
    });
</script>

<body>
        <form>
            <input id="theDate" type="date"/>
        </form>
    </body>
</html>

Answer 2

if ( $('input')[0].type != 'date' ) 
    $('input').datepicker();

http://jsfiddle.net/2AaFk/1/

Answer 3

我发现我无论如何都要运行'rake assets：precompile'。我把我的public/assets推到了git和heroku。我发布了firebug，发现错误与混合安全层有关。我将jquery和jquery-ui链接更改为https之前的http，因为heroku使用了https。这解决了我的日历问题。

datepicker不适用于FF和chrome，但它可以在IE上运行

3 个答案: