1

这里有点初学者,这个问题让我头疼了一天多。我使用 userfrosting 作为框架,带有用于网页的常用树枝文件。

我正在尝试在树枝的表单中包含一个日期选择器(bootstrap-datepicker.js 没有工作,当前使用 jquery-ui 的迭代也没有) - 但无论我做什么,我都无法得到它工作!

这是基本设置:

{% block head %}
    {{ parent() }}
    <script src="{{site.uri.js}}/jquery-1.11.2.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
    <script src="{{site.uri.js}}/custom.js" ></script>
{% endblock %}

{% block content %}
.... {{boring stuff missed out}}
<form class="form-inline" role="form">
.... {{boring stuff missed out}}
<div class="form-group row">
    <label for="datepicker" class="col-sm-3 form-control-label">Subject Date:</label>
    <div class="col-sm-6">
        <input type="date" class="form-control" id="datepicker" />
    </div>
</div>
.... {{boring stuff missed out}}
</form>
.... {{boring stuff missed out}}
{% endblock %}

{% block javascripts %}
<script type="text/javascript">
    $(document).ready(function() {
        $("#datepicker").datepicker();
    });
</script>
{% endblock %}

该框在页面上,您可以在其中输入日期等,但是单击它时不会出现任何内容(应该会出现一个日历。)

有人有想法么?我完全不知所措。我已经在本地和(如您所见,目前)在 CDN 上尝试了各种版本,但没有任何效果。我确信这可能是基本的,因为我不是经验丰富的网络开发人员或任何东西,但任何建议或工作示例将不胜感激!

4

2 回答 2

1

呃!掌心

好吧,在对检查器输出进行一些挖掘和认真考虑之后(感谢 CTRL-SHIFT-I!),结果证明这是脚本加载顺序和加载多个脚本的简单案例。

我没有意识到 twig 在我要求它加载到我正在创建的模板中的内容之上加载了一整桶脚本。只有在看到页面的检查器输出后,我才看到我正在尝试加载两个不同版本的 jQuery,并且我自己的自定义脚本被乱序加载 - 我在这里加载它们:

{% block head %}
  {{ parent() }}
  <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
  <script src="{{site.uri.js}}/custom.js" ></script>
{% endblock %}

该块应保留给样式表。相反,我应该在这里加载它们:

{% block page_scripts %}
  <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
  <script src="{{site.uri.js}}/custom.js"></script>
{% endblock %}

...以便在所有默认的 Bootstrap 和 userfrosting 脚本之后加载它们。

于 2016-03-20T12:19:12.507 回答
0

https://jqueryui.com/datepicker/使用 type="text" 作为输入字段。当我用谷歌搜索此事时,似乎 type="date" 至少以前曾引起过问题。

简而言之:我会尝试将 type="date" 更改为 type="text"。

于 2016-03-20T08:51:52.390 回答