1

我有一个我已经开发了一段时间的应用程序现在总是在本地机器上。我现在将它放入服务器环境中,并且在将模板插入主干视图时,我认为这些问题与 jQuery 的 .html() 函数的时间有关。

关于代码(重要部分):

应用程序.js

define(["models/mapModel",
        "views/base/mapView"],function(MapModel, MapView){
    var initialize = function(){

    // Set up the application here
    var mapModel, mapView;

    dojo.ready(function(){

        mapModel = new MapModel();

        mapView = new MapView({
            model : mapModel
        });

        $("#appRoot").html(mapView.render().el);

    });
  };

  return {
    initialize: initialize
  };
});

视图模板.html

<div id="map">map goes here</div>

地图视图.js

   // 'viewTemplate' is being retrieved with dojo's define() method,
   // this is not the issue as it is working in many other places.

   initialize : function(){
        var selectFeature = lang.hitch(this, this.getFeature);
        topic.subscribe("selectFeature", selectFeature);
    },
    render : function(){
        var tmpl = _.template(viewTemplate);
        this.$el.html(tmpl());
        this.model.on("change:map", this.createLocator, this);

        //Create the map once everything is drawn
        $(document).ready($.proxy(
            function() {
                this.createMap();
            },
        this));

        return this;
    },
    createMap : function(){
        console.log($('#appRoot').length); // returns 1
        console.log($('#map').length);     // returns 0
    }

CreateMap 函数中的两行说明了我的问题。#appRoot 是在 index.html 中静态定义的,而 #map 是由 jQuery 的 .html() 函数在渲染中插入的。似乎在 CreateMap() 触发时没有插入 #map 元素。同样,这只发生在从 localhost 以外的机器上访问应用程序时。

谢谢太平绅士

4

1 回答 1

2

试试this.$('#map').length

$('#map').length不起作用,因为#map尚未添加到页面中,因为您在添加之前调用了渲染。

$("#appRoot").html(mapView.render().el);// 渲染视图,然后添加到页面。

下面的代码也可以修复它,但this.$无论如何使用会更好。

$("#appRoot").html(mapView.el); // add to page
mapView.render(); // render
于 2013-03-04T19:42:00.843 回答