2

好的,重点是让书签加载一个外部 js,该 js 在当前网页上创建 jquery、jquery-ui 和一个 css 文件,一切都是跨域完成的。由于某种原因,当 jquery 代码运行时,jquery-ui 中包含的 dialog() 函数不存在。我的猜测是 jquery 在外部脚本加载之前执行代码。

请帮忙!

 function loadjscssfile(filename, filetype){
 if (filetype=="js"){ //if filename is a external JavaScript file
  var fileref=document.createElement('script')
  fileref.setAttribute("type","text/javascript")
  fileref.setAttribute("src", filename)
 }
 else if (filetype=="css"){ //if filename is an external CSS file
  var fileref=document.createElement("link")
  fileref.setAttribute("rel", "stylesheet")
  fileref.setAttribute("type", "text/css")
  fileref.setAttribute("href", filename)
 }
 if (typeof fileref!="undefined")
  document.getElementsByTagName("head")[0].appendChild(fileref)
}

loadjscssfile("http://localhost/js/jquery-1.3.2.min.js", "js") //dynamically load and add this .js file
loadjscssfile("http://localhost/js/jquery-ui-1.7.2.custom.min.js", "js") //dynamically load "javascript.php" as a JavaScript file
loadjscssfile("http://localhost/css/redmond/jquery-ui-1.7.2.custom.css", "css") //dynamically load and add this .css file

$(document).ready(function() {
    var title = document.title;
    var location = document.location;
    var documentInfo = "url="+location+"&title="+title;


    div = $("<div id=dialog name=dialog>").html("<img src='http://localhost/ajax-loader.gif' alt='loader' style='padding-left:15px;'/>");

    $("body").prepend(div);
    $("#dialog").dialog();


    var script = $.ajax({url: "http://localhost/parse.php", data: documentInfo, async: false}).responseText;
    $("#dialog").html(script);


});
4

2 回答 2

2

你已经很幸运了,你的脚本在调用 $ 函数时没有崩溃$(document):)

这是一个例子。

测试.js:

function sleep(milliseconds)
{
    var end = new Date().getTime() + milliseconds;

    while (new Date().getTime() < end);

    document.write('external script executed<br/>');
}

sleep(3000);

测试.html

<html>
<head>
    <title>test</title>
    <script type="text/javascript">
        var fileref=document.createElement('script');
        fileref.setAttribute("type","text/javascript");
        fileref.setAttribute("src", "test.js");
        document.getElementsByTagName("head")[0].appendChild(fileref)

        document.write('page script executed<br/>');
    </script>
</head>
<body>
</body>
</html>

test.htmltest.js在写入文档之前加载。如果您期望结果是:

执行的外部脚本

执行的页面脚本

……那你就错了。

当您将<script>元素附加到<head>页面时,该appendChild()函数会在添加元素后立即返回,它不会等待您的脚本完全加载。在上面的示例中,输出将是:

执行的页面脚本

执行的外部脚本

这就是为什么我说你很幸运能够在你不确定它是否完全加载的时候使用 jQuery。

解决此问题的方法是将您$(document).ready(...);作为脚本附加到<head>您的文档中。您可以期望普通浏览器(如果您明白我的意思)会按照您将脚本添加到页面的顺序加载和执行脚本。

    var pageScript = document.createElement('script');
    pageScript.setAttribute("type", "text/javascript");
    var pageScriptSource = document.createTextNode("document.write('page script executed<br/>');");
    pageScript.appendChild(pageScriptSource);
    document.getElementsByTagName("head")[0].appendChild(pageScript);

用FF和IE测试。工作在FF...

这不是一个完整的解决方案,但我没有时间(也不想)为 IE 找到一个 hack;)

于 2010-01-05T12:47:18.320 回答
0

尝试使用 jQuery.getScript:http ://docs.jquery.com/Ajax/jQuery.getScript

您可以指定将在加载脚本时运行的回调。

于 2010-01-05T11:02:01.233 回答