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

スクリプトでは、「readHTMLFile」は関数「addPanels」によって認識されないため、同じレベルに配置する必要があります。

このスクリプトは機能するはずです

<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 に答える