javascript - 为什么 jQuery 的加载事件不会在动态插入的脚本元素上触发？

Question

我正在使用 jQuery 动态插入脚本元素。脚本按预期加载，但加载事件未触发。

jQuery('<script/>').attr({
    type : 'text/javascript',
    src : 'http://platform.twitter.com/widgets.js'
}).appendTo('body').load(function(){
    /* This alert does not fire: */
    alert('I just loaded!');
});

如果我使用常规 JavaScript 插入元素，加载事件会触发并可以用 jQuery 捕获。

var e = document.createElement('script'); 
e.type = 'text/javascript';
e.src = 'http://platform.twitter.com/widgets.js';
document.body.appendChild(e);

jQuery(e).load(function(){
    /* This alert does fire: */
    alert('I just loaded!');
});

我做错了什么？

Answer 1

使用 jQuery.getScript()^[docs]方法代替。

$.getScript('http://platform.twitter.com/widgets.js',function(){
    alert('I just loaded!');
});

或者，在当前版本的 jQuery 上，使用如下的 promise 模式

$.getScript('http://platform.twitter.com/widgets.js')
  .done(function(){
    alert('I just loaded!');
  })
  .fail(function(){
    console.log('script could not load');
  })
;

---

编辑:删除了从问题中复制的代码注释，因为它使答案更加困惑。感谢@Jeff感谢指出。