Question

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

我尝试访问的所有文件都在同一个文件结构中。目前我的外部.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时刻，所以朝向正确的手册/教程的方向会很棒！

丹

Answer 1

在你的脚本中，“readPaMLs”不知道函数“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>

Answer 2

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/

在外部文件中使用JQuery获取文本文件内容

2 个答案: