Axure中等待远程脚本加载完成后再执行注入脚本

现状

网上已经有很多在Axure注入远程脚本的方法，大多数都是使用$axure.utils.loadJS()方法，再通过延时几秒去执行代码。但是如果碰到网络不好的时候，会出现找不到远程脚本中的方法，还需要再去做轮询。

分析

找到axutils.js文件，找到loadJS：

$axure.utils.loadJS = function (url) {
  $('head').append('<script text="text/javascript" language="JavaScript" src="' + url + '"></script>');
};

通过分析源码可得知是在<head/>里插入了一个<script/>而已。而<script/>标签在远程文件加载完成时会自动触发OnLoad方法，所以我们可以使用这一点来实现。

教程

因为Axure自带是jQuery，我们可以直接使用：

javascript:$('<script/>').on('load',function(){执行脚本代码}).appendTo('body').attr('src','远程脚本地址');

其中把 执行脚本代码 换成你的代码，把 远程脚本地址 换成你的远程脚本地址就可以了。

还有一种情况，就是我们要实现的功能可能需要多个脚本，基于一个脚本还依赖于另一个脚本，要等父脚本加载完成后才能加载子脚本，那么我们就把代码再嵌套一下：

javascript:$('<script/>').on('load',function(){$('<script/>').on('load',function(){执行脚本代码}).appendTo('body').attr('src','子远程脚本地址');}).appendTo('body').attr('src','父远程脚本地址');

如果有多级依赖，就多级嵌套，这样可以保证每段代码都在远程脚本都加载完成后才执行。

进阶

其实jQuery本来就有jQuery.getScript()可供使用，并且还能处理HTTP失败，有兴趣的可以去查看一下官方文档：

如果觉得我的教程做的不错呢，欢迎关注、收藏、转发、捐赠，谢谢。

原文链接：Axure中等待远程脚本加载完成后再执行注入脚本

转载请注明：最InのAxure » Axure中等待远程脚本加载完成后再执行注入脚本