动态插入 DOM 的 JavaScript 交互初始化问题

Amaze UI Web 基于 jQuery 开发，在 document ready 的时候初始化默认接口。动态插入的 DOM 大多已经是在 ready 事件之后，所以没有进行默认的初始化操作。

// Init code
UI.ready(function(context) {
  $('[data-am-tabs]', context).tabs();
});

一些插件中通过事件委托可以解决动态插入 DOM 的事件绑定问题，但是并不是所有插件都可以这样，因为有的插件用户操作没有定位到要绑定元素的 DOM 上。比如 https://github.com/twbs/bootstrap/blob/master/js/affix.js 这类插件。

要想自动处理这类问题可以借助 MutationObserver 监视 DOM 变化，但是浏览器支持不好，不得不在插入 DOM 以后，调用相应接口手动初始化，类似问题可以参考打了 event-binding 标签的 issue。

如果觉得逐个初始化麻烦，可以在插入 DOM 以后，调用一下下面的函数：

var utils = {
  // 初始化 http://amazeui.org/widgets 中的组件
  initAMUIWidhets: function() {
    $('[data-am-widget]').each(function() {
      var name = this.getAttribute('data-am-widget');
      if (AMUI[name] && typeof AMUI[name].init === 'function') {
        AMUI[name].init();
      }
    });
  },

  // 初始化其他 jQuery 插件
  // 注意：需要在 DOM 中添加插件名称标识，如 `data-am-plugin="dropdown"`
  initAMUIPlugins: function() {
    $('[data-am-plugin]').each(function() {
      var plugin = this.getAttribute('data-am-plugin');
      
      if ($.fn[plugin]) {
        $(this)[plugin]();
      }
    });
  }
};