Question

我正在构建一个应用程序，我在后端使用Django和jQuery UI / Backbone来构建前端。我正在将一个Django生成的表单放入一个带有jQuery.get（）的页面中。这部分工作正常，但现在我想在表单中添加一些jQuery UI东西（例如，一个日期选择器，一些打开对话框的按钮等）。所以，这是相关的代码：

var InstructionForm = Backbone.View.extend({
  render: function() {
    var that = this;
    $.get(
      '/tlstats/instruction/new/',
      function(data) {
        var elements = $(data);
        $('#id_date', elements).datepicker();
        that.$el.html(elements.html());
      }
    };
    return this;
  }
});

路径/ tlstats / instruction / new /返回一个Django生成的HTML片段。发生的事情是输入＃id_date正在添加hasDatePicker类，而datepicker div被附加到我的＆lt; body＆gt; element（两者都是预期的），但是当我点击输入＃id_date时，没有任何反应。没有出现datepicker小部件，控制台中没有错误。为什么会发生这种情况？

另外，有点偏离主题，但在试图自己解决这个问题时，我遇到了几个代码示例，其中人们正在做的事情：

$(function() {
  $('#dialog').dialog(...);
  ...
});

然后：

var MyView = Backbone.View.extend({
  initialize(): function() {
    this.el = $('#dialog');
  }
});

这是否会破坏Backbone的目的，将所有jQuery UI代码完全置于任何Backbone结构之外？或者我是否误解了Backbone的作用？

感谢。

Answer 1

我认为你的问题就在这里：

$('#id_date', elements).datepicker();
that.$el.html(elements.html());

首先将datepicker与.datepicker()绑定，然后将elements转换为HTML字符串将其全部丢弃：

that.$el.html(elements.html());

然后将该字符串放入$el。当你说e.html()时，你正在使用包含事件绑定和其他所有东西的包装DOM对象，并在字符串中变成一个简单的HTML片段，该过程会丢弃所有不是（例如事件绑定）简单的HTML。

给jQuery对象本身.html()：

$('#id_date', elements).datepicker();
that.$el.html(elements);

或在添加HTML后绑定datepicker：

that.$el.html(elements);
that.$('#id_date').datepicker();

Backbone View中的jQuery UI添加元素，但不响应事件

1 个答案: