jQuery, сделайте что-нибудь после загрузки внешних файлов - PullRequest
Новая
       14

jQuery, сделайте что-нибудь после загрузки внешних файлов

2 голосов
/ 05 января 2010

Хорошо, дело в том, что букмарклет загружает внешний js, который создает jquery, jquery-ui и файл css на текущей веб-странице, причем все делается междоменным. По какой-то причине к моменту запуска кода jquery функция dialog (), включенная в jquery-ui, не существует. Я предполагаю, что 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);


});

Ответы [ 2 ]

2 голосов
/ 05 января 2010

Вам уже повезло, что ваш скрипт не зависал при вызове функции $ в $(document):)

Вот пример.

test.js: 

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

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

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

sleep(3000);

test.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.html загружает test.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. Работает в ФФ ...

Это не полное решение, но у меня нет времени (и я не хочу) найти взлом для IE;)

0 голосов
/ 05 января 2010

Попробуйте использовать jQuery.getScript: http://docs.jquery.com/Ajax/jQuery.getScript

Вы можете указать обратный вызов, который будет запускаться при загрузке скрипта.

...