jquery - Rails：如何使用 JQueryUI

Question

我有 rails 3.2.1 并测试 JQuery UI，我想显示一个 DatePicker。因此，在“new.hmtl.erb”页面中，我放置了以下标签：

<p>Date: <input type="text" id="datepicker" /></p>

在 project.js.coffee （“新”视图页面由项目控制器呈现）我写道：

$( "#datepicker" ).datepicker();

为什么 DatePicker 没有出现？

在新页面的源代码中，我有：

<script src="/assets/projects.js?body=1" type="text/javascript"></script>

其中包含：

(function() {
  $("#datepicker").datepicker();
 }).call(this);

我必须包括一些宝石？在 application.js 我有：

//= require jquery
//= require jquery_ujs
//= require_tree .

谢谢

score 1 · Accepted Answer

在您的情况下，将初始化您的 UI 对象的部分代码转到页面new.html.erb。您将其添加到底部：

<script>
  $(document).ready(function() {
    $( "#datepicker" ).datepicker();
  });
</script>

这意味着当页面加载时，它将初始化您的输入对象。如果您需要这部分代码在许多页面中可用，您可以在application.html.erb布局中添加此代码。您可以在 Rails 指南页面上阅读有关布局的更多信息。

编辑

出于教育目的，这里有额外的评论：如果你想把代码放进去，application.js你可以做以下事情：

function setDatePicker() {
  $( "#datepicker" ).datepicker();
}

然后做

<script>
  $(document).ready(function() {
    setDatePicker();
  });
</script>

如果您想要在application.js加载时执行的代码，您只需将其放在那里而不将其包装在函数中（不建议）。它会在 application.js 加载时执行，但它不会工作，因为它可以在加载 DOM 之前触发（并且可能会）。所以总是使用 jquery 的.ready.

1 回答 1