jQuery的。对（）当脚本插入DOM未结合(jQuery .on() not bound when

我有一个包含一个自定义的jQuery的事件处理程序的远程JavaScript文件。当这个被插入到DOM作为<script src='...'></script>元素，自定义的事件处理程序没有被注册。

不过，如果我添加了完全相同的脚本直JS（ <script>...</script>事件处理程序注册，一切都按预期执行。

为什么没有在事件处理程序正在jQuery的束缚，当脚本插入一个远程文件？

例

远程文件包含自定义事件处理程序：

console.log('Before custom event handler');
$('button').on('customEvent', function(){
    console.log('customEvent Caught');
});

https://gist.github.com/2767385

（ 非工作 ）的JavaScript这将插入脚本到DOM：

var scriptNode = document.createElement('script');
    scriptNode.src = 'https://gist.github.com/raw/2767385/b9ddea612ff60b334bd2430e59903174e527a3b5/gistfile1.js';
document.body.appendChild(scriptNode);

的（ 工作的替代 ）的JavaScript其插入脚本作为内嵌到DOM：

var scriptText = "console.log('Before custom event handler'); $('button').on('customEvent', function(){ console.log('customEvent Caught'); });",
    scriptNode = document.createElement('script');
scriptNode.appendChild(document.createTextNode(scriptText));
document.body.appendChild(scriptNode);

触发事件：

$('button').triggerHandler('customEvent');

该JS被正确读取，并正确执行了该处理程序。

JSFiddles

远程文件 -非工作例如： http://jsfiddle.net/3CfFM/3/
使用文本 -工作的选择： http://jsfiddle.net/3CfFM/2/

发生了什么？

为什么没有在事件处理程序正在jQuery的束缚，当脚本插入一个远程文件？

你错了。与远程脚本使用时，事件处理程序被绑定; 它只是需要一点时间。浏览器需要将其绑定的处理程序之前进行的HTTP请求。这意味着，你触发原始事件与triggerHandler('customEvent')没有捕捉到，因为它的气泡和捕获已经完成。

如果等待一秒钟，然后再次单击该按钮，您将看到该事件处理程序确实已经被绑定。您也可以通过延迟你看到这个triggerHandler直到脚本加载电话：

$('button').click(function() {
    var scriptNode = document.createElement('script');
    scriptNode.src = 'https://gist.github.com/raw/2767385/897cffca74411dbb542c0713bacb5a4048d6708b/gistfile1.js';
    scriptNode.onload = function() {
        $('button').triggerHandler('customEvent');
    };
    document.body.appendChild(scriptNode);
});

http://jsfiddle.net/3CfFM/4/