相关疑难解决方法(0)

我正在尝试按顺序加载一组脚本,但onload事件并没有为我开火.

    var scripts = [
        '//cdnjs.cloudflare.com/ajax/libs/less.js/1.3.3/less.min.js',
        '//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0-rc.3/handlebars.min.js',
        MK.host+'/templates/templates.js'
    ];

    function loadScripts(scripts){
        var script = scripts.shift();
        var el = document.createElement('script');
        el.src = script;
        el.onload = function(script){
            console.log(script + ' loaded!');
            if (scripts.length) {
                loadScripts(scripts);
            }
            else {
                console.log('run app');
                MK.init();
            }
        };

        $body.append(el);
    }

    loadScripts(scripts);

我猜想当使用jQuery将元素附加到DOM时,el.onload等本机事件不会触发.如果我使用原生,document.body.appendChild(el)那么它会按预期激发.

我使用以下命令将jQuery库附加到dom:

 var script = document.createElement('script');
 script.src = 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js';
 script.type = 'text/javascript';
 document.getElementsByTagName('head')[0].appendChild(script);

但是,当我跑:

jQuery(document).ready(function(){...

控制台报告错误:

Uncaught ReferenceError: jQuery is not defined

如何动态加载jQuery以及在dom中使用它？

我有一个包含以下内容的initializor.js:

if(typeof jQuery=='undefined')
{
    var headTag = document.getElementsByTagName("head")[0];
    var jqTag = document.createElement('script');
    jqTag.type = 'text/javascript';
    jqTag.src = 'jquery.js';
    headTag.appendChild(jqTag);
}

然后我将该文件包含在另一页的某个地方.代码检查是否加载了jQuery,如果不加载,则将其添加到Head标记.

但是,jQuery没有初始化,因为在我的主文档中,我声明了一些事件来测试它.我还尝试在支票下面编写一些jQuery代码,Firebug说"jQuery未定义".这是一种方法吗？Firebug在head标签中显示jquery包含标签!

另外,我可以动态地将代码添加到$(document).ready()事件中吗？或者只是将一些Click事件添加到几个元素中？

我一直在对Twitter的嵌入式时间表进行大量研究.我一直试图弄清楚是否可以知道时间线何时完成加载并显示在页面上.此问题已被要求,但尚未实施.我已经走到了尽头,希望有人能够帮助我找到解决方案.这是我到目前为止所发现的:

添加嵌入式时间轴的代码:

<a class="twitter-timeline" href="https://twitter.com/twitterapi" data-widget-id="YOUR-    WIDGET-ID-HERE">Tweets by @twitterapi</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

脚本运行时会发生什么:

1. 该脚本使用元素替换<a>标记<iframe>.

2. iframe准备好的内容,但是头像图像和'关注@username'按钮没有完成下载.将iframe的height属性设置为0,这样你就不会看到一个没有图像内容.

3. 下载了头像图像,但是"关注@username"按钮仍在下载.内容仍然不可见.

4. 'follow @username'按钮已完成下载.将iframe的height属性设置为匹配的内容的高度iframe.时间轴现在可见.

现在,我已经尝试了我能想到的所有内容,以确定时间线何时可见(不使用settimeout/interval).目标是进行非轮询事件/函数/回调.以下是我迄今为止没有成功的尝试:

• 设置在事件侦听器iframe(如onload,DOMContentLoaded,DOMFrameContentLoaded,等),要知道当内容加载完毕.这iframe没有用,因为没有src属性.在浏览了uglified代码后(我无法找到未压缩的版本),我的猜测是它正在使用写入将内容添加到主体中iframe.
• 设置事件侦听器以了解height属性何时更改iframe.从理论上讲,此事件应该触发三次:第一次加载内容时,第二次height设置为0时,第三次height设置为显示完全加载的时间线时.但是,我只能让前两个案件的事件发生,而第三个案件(我实际想要的那个)从来没有.我用过DOMSubtreeModified,onreadystatechange和onpropertychange,但只是DOMSubtreeModified用来解雇这个事件.
• 在cotents上设置事件监听器iframe.因为JavaScript可以iframe从Twitter 内部到达,所以可以抓取其中的任何元素iframe(例如document …

在脚本实际附加到文档之前,如何才能使回调无法运行？

function addScript(filepath, callback){
    if (filepath) {
        var fileref = document.createElement('script');
        fileref.setAttribute("type","text/javascript");
        fileref.setAttribute("src", filepath);
        if (typeof fileref!="undefined")
            document.getElementsByTagName("head")[0].appendChild(fileref);
    }
    if (callback) {
        callback();
    }
}

我正在加载一个使用回调函数的外部脚本,它返回一些特定的数据.如果未收到此数据,则应显示错误.

这是我做的代码:

<script>
//setting initial state so that function will only work once
var visitors_loaded=false;  
var my_callback = function( data ) {
    if (visitors_loaded) return 0;
    if (data) { 
        //success: callback function is called and it has a proper data
    visitors_loaded=true;
    alert(JSON.stringify(data));
    }
    else alert ('error'); //something went wrong
};
</script>
<script onload="my_callback(null)" onerror="my_callback(null)"
src="https://api.clicky.com/api/stats/4?site_id=32020&sitekey=9a19b1a4d1171193&type=visitors&date=this-month&output=json&json_callback=my_callback"></script>

正如你所看到的......很多东西可能会出错,所以我自然会添加一个onerror事件.如果您将脚本的主机名或域更改为不存在的内容,则会发生此错误事件.

但是,如果您只更改脚本的URL,它仍然可以连接到服务器并激活onload事件.我的回调函数不会被调用那些无效的请求,所以我也添加了一个onload处理程序.

现在的问题是,如果所有正常加载并返回数据,它将同时触发回调函数和onload.我注意到在onload之前触发了回调函数并设置了visitor_loaded变量,以便只调用一次处理函数.

到目前为止,它在JS小提琴和我的离线网站中完美运行,但我想知道这是否是预期的行为？在onload处理程序之前,json_callback函数是否总是优先？

https://jsfiddle.net/5sfk9ht5/4/

我正在尝试使用以下代码加载动态脚本:

var headID = document.getElementsByTagName("head")[0]; 
var script = document.createElement('script'); 
script.type='text/javascript'; 
script.src="js/ordini/ImmOrd.js"; 
script.setAttribute("onload", "crtGridRicProd();");                       
headID.appendChild(script);

我需要在页面启动时启动crtGridRicPrdo()函数,并且在FireFox中一切正常但在Internet Explorer中我遇到了问题!

我知道我的主题非常棘手,但我不知道如何在这个主题上更加精通它.所以这里是怎么回事.我有一个按钮

<a href="#" onClick="loadtheFile()">Load IT!</a>

在脚本标签上:

function loadTheFile() {
var script = $("<script><\/script>");
script.attr("type", "text/javascript");
script.attr('src','http://www.thisismyexternalloadingjsfile"');
$('body').append(script);
alert("done! the file has been loaded");
}

脚本很好,加载时会自动有一个模态框.但问题是,我的警报似乎首先发射的是脚本

那我怎么知道我是否已经完成加载脚本？

更新第一次尝试回答:

function loadTheFile() {
    var script = $("<script><\/script>");
    script.attr("type", "text/javascript");
    script.attr('src','http://www.thisismyexternalloadingjsfile"');
    $('body').append(script);
    $(document).ready(function() {
      alert("done! the file has been loaded")};
    }

同样的问题