日期:2014-05-16 浏览次数:20381 次
/**
 * 该段代码使用了 prototype.js,这里略过 prototype.js 的引入
 * 使用 document.createElement 的方式动态创建 script 脚本
 * 
 * @param scriptId <script> 节点的 id
 * @param url 请求的 js 的 url
 * @param callback 加载完 js 后的回调函数
 */
function loadScript(scriptId, url, callback) {
  // 根据 url 中是否出现过 "?" 来决定添加时间戳参数时使用 "?" 还是 "&"
  var paramPrefix = url.indexOf("?") == -1 ? "?" : "&";
  url = url + paramPrefix + "rnd=" + new Date();
  var script = $(scriptId);
  // 没有 id 为 scriptId 的 script 节点,创建并附加到 document.body 上
  if (!script) {
    script = document.createElement("script");
    script.id = scriptId;
    document.body.appendChild(script);
  }
  script.src = url;
  
  // script 节点创建后,加载 url 所指定的资源后,可以进行后续处理
  // 不同浏览器判断加载是否完成的回调不一样
  
  // for firefox, google etc.
  script.onload = function() {
    if (callback) {
      callback();
    }
    
    /**
     * 对于创建过的 scriptId,传递的 url 即使在改变,firefox 中并不会再去加载,ie 是当每次 script
     * 的 url 改变时重新加载资源。为了解决在 firefox 中改变 url 不重新加载的问题,这里把上次加载资源
     * 成功后的回调函数执行完毕后,将 script 节点移除,下次就会重新创建 script 节点。
     */
    document.body.removeChild(script);
  }
  // for ie
  script.onreadystatechange = function() {
    if (this.readyState == "loaded" || this.readyState == "complete") {
      if (callback) {
        callback();
      }
    }
  }
};
/**
 * 该段代码使用了 prototype.js,这里略过 prototype.js 的引入
 * 通过 ajax 请求拿到异域的数据
 *
 * @param (String) dataUrl 异域资源的地址
 * @param (Function) callback 成功拿到异域数据后的回调函数 
 */
function loadData(dataUrl, callback) {
  var url = contextPath + "/quotation/qc!loadData.action";
  new Ajax.Request(url, {
    encoding:"UTF-8",
    method:"post",
    // dataUrl 即是向异域请求的数据地址
    parameters: {dataUrl: dataUrl},
    onComplete: function(response) {
      if (callback) {
        callback(response);
      }
    }
  });
};
// 使用 loadData 的示例
loadData("http://res.test.com/some.js", function(response) {
	eval(response.responseText);
	// 假设异域返回的数据为:var data = { server: "apache", version: "1.0" };
	// 通过 eval 后,我们可以使用 data
	alert(data.server);
});