1

我有一个外部 javascript 文件,我想用它来收集许多文本文件的内容。JQuery .get() 似乎是最明显的选择。如果 JQuery 在页面中,我可以完成这项工作,但当 JQuery 在外部文件中时则不行。我错过了一些非常简单的东西......我目前正在将普通的 javascript 与 JQuery 混合在同一个文件中,我担心它的格式很差。

我试图访问的所有文件都在同一个文件结构中。目前,我的外部 .js 中有以下内容:

function addPanels() {
    // eventually loop over list of local HTML files
    // and do some stuff with the results...
    fileContents = readHTMLFile();
}

jQuery(function($){
    readHTMLFile = $.get('../html/test.html', function(data) {
        alert('Loaded something');
        return(data);
    });
});

我的 HTML 页面包含以下内容:

<script type="text/javascript">
    $(document).ready(function(){
        addPanels();
    });
</script>

很确定这是一个 RTFM 时刻,所以朝着正确的手册/教程方向发展会很棒!

4

2 回答 2

3

在您的脚本中,函数“addPanels”不知道“readHTMLFile”,您应该将它们放在同一级别。

这个脚本应该可以工作

<script type="text/javascript">
    (function($){
        var readHTMLFile = function(url){
            var toReturn;
            $.ajax({
                url: url,
                async: false
            }).done(function(data){
                toReturn = data;
            });
            return toReturn;
        };
        $.addPanels = function(url){
            fileContents = readHTMLFile(url);  
        };
     })(jQuery);
</script>

在您的页面中,您可以这样称呼它:

<script type="text/javascript">
    $(document).ready(function(){
        $.addPanels('../test/test.html');
    });
</script>
于 2012-11-20T18:02:20.987 回答
3

是一个异步函数,当jQuery.get服务器返回请求的文档时执行一个回调。因此,您不能从该方法返回任何数据。

function addPanels() {
    // will not work
    fileContents = readHTMLFile();
}

...

readHTMLFile = $.get('../html/test.html', function(data) {
    // will not work
    return(data);
});

但是,这将起作用:

var addPanelCallback = function(html) {
    // append html (or something like that)
    alert(html);
};

var addPanel = function(url) {
   $.get(url, addPanelCallback);
};

addPanel('../html/test1.html');
addPanel('../html/test2.html');

示例:http: //jsfiddle.net/FgyHp/

于 2012-11-20T18:12:10.890 回答