Question

我尝试将数据库返回html字符串追加到每个.buttonContainer，使用action.js执行其他文件loadButton模块使用参数点特定元素。
结果应该使用不同的.buttonContainer并且使用它们的attr id连接db get result附加到每个.buttonContainer

我的问题是，如果我设置ajax选项async default true，那么返回的html字符串将追加到最后.buttonContainer。
我无法理解我已经为每个模块/函数设置了每个执行参数的at el。
为什么以及如何解决它？我试图将异步更改为false然后它工作但页面缓慢，所以我试图找到其他解决方案。

<div class="buttonContainer" data-user-id="0"></div>
<div class="buttonContainer" data-user-id="1"></div>

action.js

define(['DomReady!', 'jquery', 'loadButton'],function (DomReady, $, loadButton) {
  return {
    init: function() {
      // loop each element as parameter and execute 
      $('.buttonContainer').each(function(index, el) {
        var config = {};
        config.el = $(this);

        loadButton.init(config);
      });
    },
  }
});

loadButton.js

define(['DomReady!', 'jquery'],function (DomReady, $) {
  return {
    init: function(config) {
      this.config = {};
      this.config.el = config.el;  // set each execute have their own private attribute

      this.onLoadAction();
    },
    onLoadAction: function() {
      this.onLoadController();
    },
    onLoadController: function() {
      var userId = this.config.el.attr('data-user-id');

      var mthis = this;
      this.onLoadRequestDB('load/'+userId).done(function(response) {
        console.log(mthis.config.el);
        var response = JSON.parse(response);
        mthis.config.el.append(response.button);
      });
    },
    onLoadRequestDB: function(url) {
      return $.ajax({
        url: url,
        type: 'GET',
        processData: false,
        contentType: false,
        // async: false
      });
    },
  }
});

编辑：
https://stackoverflow.com/a/22121078/1775888我在这里找到了一些解决方案，所以我像这样编辑loadButton.js

..
init: function(config) {
          this.config = {};
          this.config.el = config.el;  // set each execute have their own private attribute

          this.onLoadAction(this.config);
        },
        onLoadAction: function(config) {
          this.onLoadController(config);
        },
        onLoadController: function(config) {
 ..

传递参数，然后工作。
但我仍然想知道为什么我在每个循环中设置loadButton.js init this，但仍然可以在ajax之后覆盖。使所有响应附加到上次执行loadButton.js config参数

的元素

为什么每个oo函数/模块在ajax之后，那么每个函数/模块属性都改为最后一次执行？

0 个答案: