javascript - 如何在 famo.us 中加载表面的动态内容 (ajax)？

Question

我的问题如下:

我有许多表面与一个唯一的网址相关联。当我移动到特定表面时，必须实时触发 url(ajax)，并且应将响应设置为表面的内容。

当我尝试执行上述操作时，它实际上在应用程序初始化时预先加载所有网址及其内容。这会减慢整个过程，这不是我想要的。我想仅当用户在该表面上处于事件状态时才加载内容。

var ajaxContent = "";
$.ajax({
  url: 'ajax/article.php?url='+escape(this.options.url),
  async: false,
  success: function(data) {
    ajaxContent = data;
  }
});

this.pageSurface = new Surface({
    size: [undefined, undefined],
    content: ajaxContent,
    classes: ["page"],
    properties: {
        backgroundColor: '#111111',
        fontSize: '16px'
    }
});

上面的代码位于表面循环中。

Answer 1

我没有使用 Ajax 的经验，但据我所知，根据你的描述，基本上你是在异步请求数据......所以我会根据这个假设来回答。

首先，我会稍微改变一下操作顺序!

for (var i = 0; i < 10; i++) {
    var surface = new Surface({
        content : '',
        classes : ['page'],
        properties : {
            backgroundColor : '#111111',
            fontSize : '16px'
        }
    });

    var ajax_request = {
        url : 'ajax/article.php?url=' + escape(this.options.url),
        async : true,
        success : function(data) {
            //possibly validate the obtained data further
            this.setContent(data);
        }.bind(surface)
    }

    var load = function load() {
        this.removeListener('mouseover', load);
        $.ajax(ajax_request);
    }.bind(surface);

    surface.on('mouseover', load);
}

我将表面绑定(bind)到特定于该表面的所有函数，否则循环内可能会发生奇怪的事情。这将确保只有一个表面加载内容，并且该内容仅分配给同一表面!

最后，您应该注意单引号和双引号，因为您同时使用它们。 Famo.us(该公司)更喜欢单引号，但如果您使用双引号也没关系。至少坚持两者中的任何一个都是更好的做法。