0

私はこの基本的な JavaScript コードを、楽しみのために作成しているミニ ファイル マネージャー プロジェクトの一部として持っていますが、残念ながら機能しません。関数内で配列get()にアクセスしようとしていますがContent.files、関数内の変数のスコープなどのために、配列が正しく設定されておらず、ページに何も表示されないようです。Firefox のエラー コンソールには何も表示されません。これを修正するにはどうすればよいですか?

ところで、最近は C# と PHP に集中しているので、単なる構文エラーでしたらご容赦ください。ありがとう！

<script type="text/javascript">

Page = {

currentdir: '/',
}

Content = {

files:[], folders:[],

get: function() {

    $.post('?p=myfiles&ajax', {
        dir: '/',
    }, function (data) {
        Content.files = data.files;
        Content.folders = data.folders;
    }, "json"); 
},

build: function () {

    for (var n = 0; n < Content.files.length; n++) {

        var id = Content.files[n].id;
        var name = Content.files[n].name;
        var size = Content.files[n].size;

        output = '<td>File</td><td>'+id+'</td><td><a href="?p=file-download&id='+id+'">'+name+'</a></td><td>'+((size / (1024*1024)).toFixed(2))+' MB</td>';

        $('#filetable').append('<tr>'+output+'</tr>');

    }
},

}

</script>
4

3 に答える 3

1

あなたが削除したコメントで（私は自分のコメントを誤って削除したので推測しています）、 を呼び出したbuild直後にメソッドを呼び出していgetます。残念ながら、get非同期の AJAX 要求を行います。つまり、Javascript は AJAX 応答を待たずにさらにコードを実行するためbuild、要求を送信した直後に実行されます。応答は将来のある時点で返されますが (今からそれほど長くはありません)、build呼び出される前に返されることはほとんどありません。つまり、項目は入力されません。コールバックを提供する方法の例を次に示します。

var Page = {   // <-- Add `var`
    currentdir: '/',
};

var Content = {   // <-- Add `var`
    files:[],
    folders:[],
    get: function (callback) {
        $.post('?p=myfiles&ajax', {
            dir: '/',
        }, function (data) {
            Content.files = data.files;
            Content.folders = data.folders;
            //if (typeof callback !== "undefined") { // <-- Might be better than below, in the special cases where some functions are "objects" in IE
            if (typeof callback === "function") {
                Function.prototype.apply.call(this, callback, arguments);
            }
        }, "json");
    },
    build: function () {
        for (var n = 0; n < Content.files.length; n++) {
            var id = Content.files[n].id;
            var name = Content.files[n].name;
            var size = Content.files[n].size;
            output = '<td>File</td><td>'+id+'</td><td><a href="?p=file-download&id='+id+'">'+name+'</a></td><td>'+((size / (1024*1024)).toFixed(2))+' MB</td>';
            $('#filetable').append('<tr>'+output+'</tr>');
        }
    }    // <-------------- Remove the comma
};

Content.get(Content.build);

このようにして、任意の関数参照を渡すことができContent.get、それは の直後に呼び出さContent.filesれContent.folders、AJAX 要求から取り込まれます。

buildその他のいくつかのこと - オブジェクトのメソッドの後のカンマを削除しContentます。また、 andオブジェクトvarの宣言にはおそらく を使用する必要があります。PageContent

于 2013-03-22T18:15:35.503 に答える
-1

Content実際には定義の過程にあるため、まだ定義されていませんが、オブジェクトスコープでは で参照できますthis。ポスト コールバックには独自のスコープがありますがthis、より高いスコープで再割り当てすることができます。

get: function() {
    var self = this;
    $.post('?p=myfiles&ajax', {
        dir: '/',
    }, function (data) {
        self.files = data.files;
        self.folders = data.folders;

http://jsfiddle.net/ExplosionPIlls/xYByU/

$.postまた、メソッドの実行がいつ終了するかわからないことに注意することも重要です。そのため、Content満たされることへの依存は、そのリクエストの完了に依存する必要があります。

于 2013-03-22T18:05:50.490 に答える
-2

オブジェクト内のthis.files代わりに使用したいと思うでしょう。作成中のオブジェクトへの参照です。あなたがやっているように、その値を閉じることができるかもしれませんが、正直わかりませんが、それは悪臭を放ち、それが暗黙の変数の目的です。オブジェクトの外部では、変数に割り当てられたら、そのメンバー変数を参照すると言うのが正しいです。Content.filesContentthisContentContent.files

補足として、スクリプトをすぐに呼び出される匿名関数で囲むことをお勧めします。これにより、オブジェクトの他のメンバーと衝突するリスクがなくなりwindowます。これは、変数の宣言に使用しない場合varや、変数を作成する場合に発生する可能性があります。関数の範囲外です（両方を行っています）。これを読んで、これをよりよく理解することができます。

于 2013-03-22T18:04:57.563 に答える