javascript - requireJS - 使用 ajax 请求

Question

索引.html

<link href="Styles/bootstrap.css" rel="stylesheet" />
<script data-main="Scripts/app" src="Scripts/require.js"></script>

<a class="btn0">button 0</a>
<div class="target"></div>

应用程序.js

require({
    paths : {
        jQuery : 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min',
        tooltip : 'bootstrap-tooltip'
    }
});

require([ 'jQuery' ], function() {
    require(['tooltip' ], function() {
        $(".btn0").click(function() {
            $(".target").load('btn0.html');
        });

        $('[rel=tooltip]').tooltip();
    });
});

btn0.html

 Wouldn't it be nice to see a Tooltip <a href="#" rel="tooltip" title="Oh yeah!">here</a>?

---

在这种情况下，工具提示不起作用。仅当我剪切$('[rel=tooltip]').tooltip();并粘贴到 btn0.html 时才有效，例如：

<script>
$('[rel=tooltip]').tooltip();
</script>

我的问题是。如何组织 btn0.html 中需要的 javascript 代码？可以把btn0.html的JS内容放到app.js里吗？

Answer 1

tooltip()加载 btn0.html 时必须调用函数。rel="tooltip"初始化该页面时不存在的元素。

require([ 'jQuery' ], function() {
  require(['tooltip' ], function() {
    $(".btn0").click(function() {
      $(".target").load('btn0.html', function ()
      {
        $('[rel=tooltip]').tooltip();
      })
    });
  });
});