5

即使在 Backbone.Marionette.ItemView 的 onRender 方法中，我也无法访问元素。

例如，我有：

模板：

<input type="text" id="searchBox">`

项目视图：

View = Backbone.Marionette.ItemView.extend
    template: searchTemplate
    onRender:
        @setTypeahead ['a', 'b', 'c', 'd']
    setTypeahead: (valueArray) ->
        console.log $('#searchBox')
        $('#searchBox').typeahead
            source: valueArray

出乎意料的是，记录到控制台的对象不包含输入元素。选择器不起作用。这是为什么？

Marionette 的 github 上的小代码块内的注释提到“在这里操作。el它已经被渲染，并且充满了视图的 HTML，准备好了。” 除非我误解了这一点，否则我认为模板将被渲染并准备好在 ItemView 的 onRender 函数中进行操作。

4

2 回答 2

4

您需要将 jQuery 选择器的范围限定为视图，因为 HTML 元素尚未添加到 DOM。


View = Backbone.Marionette.ItemView.extend
    template: searchTemplate
    onRender:
        @setTypeahead ['a', 'b', 'c', 'd']
    setTypeahead: (valueArray) ->
        console.log $('#searchBox')

        @$('#searchBox').typeahead
            source: valueArray

之所以使用onShow有效，是因为元素此时已添加到 DOM 中。但这是一个坏主意，因为它会允许选择器在页面中找到具有指定查询的所有元素，而不仅仅是针对此特定视图实例的元素。通过使用@$("#searchBox")，您将 jQuery 选择器的范围限定为视图实例，并且$el即使视图尚未添加到 DOM 也能够在视图中找到元素。

于 2013-01-13T04:34:26.700 回答
3

好的，当然，一旦我最终决定在这里提问，我就自己回答这个问题。

我应该使用onShow而不是onRender. IMO，木偶文档似乎仍然具有误导性。

于 2013-01-12T00:22:42.240 回答