0

これは私のコードです:

        var rowData = [];

        var showFiles = function () {
            var input = document.getElementById('doc-upload');
            if (input.files.length > 0) {
                for (var i = 0; i < input.files.length; i += 1) {
                    rowData.push([input.files[i].name]);
                };
                console.log(rowData);
            };
        };
        document.getElementById('doc-upload').addEventListener('change', showFiles, this);

'rowData'は、何かをアップロードするときに初めて通常の値を受け取ります。2回目の試行で、着信値の複製が開始されます。

最初に1つのファイルをアップロードした場合は、問題ありません。2回目は、2つの同じファイルを取得しました。3番目の4つのファイル、exetera。

なぜこれが起こっているのですか?

UPD:

詳細な説明:何が起こっているのか:x.docをアップロードします私の配列は[x.doc]ですが、y.docをアップロードしたいと思います。y.docを選択すると、配列が[x.doc、y.doc、y.doc]に変わり、z.docをアップロードすると、aarayは[x.doc、y.doc、y.doc、zのようになります。 doc、z.doc、z.doc、z.doc]。等々。それは長さのプロパティで何かをしなければなりません、私はそれをどうにかして台無しにしました。

UPD2:

これで、コードのフルバージョンが次のようになります。

    //file upload
    var rowData = [];
    docAddButton.addListener('click', function () {
        var showFiles = function () {
            var input = document.getElementById('doc-upload');
            if (input.files.length > 0) {
                for (var i = 0; i < input.files.length; i += 1) {
                    if (rowData.indexOf(true, input.files[i].name, Math.round(input.files[i].size * 0.001) + ' кб') === -1) {
                        rowData.push([
                            true,
                            input.files[i].name, 
                            Math.round(input.files[i].size * 0.001) + ' кб'
                        ]);
                    }
                }
                console.log(rowData);
                tableModel.setData(rowData);
            };
        };
        document.getElementById('doc-upload').addEventListener('change', showFiles, this);
    });

助けてくれたすべての人に感謝します!

解決策:UPD2から、eventListenerの「クリック」内に関数があることがわかります。何が起こっていたのかというと、入力ボタンを押すたびに、余分な「変更」リスナーを受信して​​いました。

入力用の.addListenerを.addListenerOnceに変更しました。

4

2 に答える 2

0

おそらく、ページをリロードしておらず、クリアしていませんrowData。を定義する方法/場所は示していませんがrowData、の呼び出し間で同じインスタンスが再利用されているように見えますshowFiles。(どこにも宣言していない場合は、The Horror of Implicit Globalsの餌食になります。)


以下のコメントから、エントリを保持したいが、新しいエントリrowDataのみを追加したいようです。その場合は、明示的なチェックが必要になります。

var showFiles = function () {
    var input, i, file;

    input = document.getElementById('doc-upload');
    for (i = 0; i < input.files.length; i += 1) {
        file = input.files[i].name;
        if (indexOfFile(rowData, file) === -1) {
            rowData.push([file]);
        }
    };
    console.log(rowData);
};

function indexOfFile(data, file) {
    var index;

    for (index = 0; index < data.length; ++index) {
        // Note that the 0 may need to be changed if the
        // `rowData.push([file])` line above doesn't put
        // the filename at index 0
        if (data[index][0] === file) {
            return index;
        }
    }
    return -1;
}

補足:ファイル名だけでなく配列をプッシュする理由は、その配列に他の情報も含まれているためですが、質問から除外したためです。それは問題ありませんが、デリケートな場合があります0。上記のインデックスに関する私のメモを参照してください。代わりに、オブジェクトの配列を使用することを検討してください。

rowData.push({
    file: file,
    other: "info",
    goes: "here"
});

...そしてindexOfFile

if (data[index].file === file) {

そうすれば、プッシュしているものの構造を変更しても、コードが壊れにくくなります。

于 2013-02-06T10:10:23.683 に答える
0

基本的に、

rowData.push()

変数の最後に要素を追加し続けます。これらの入力がすでに存在するかどうかを確認する必要があります。

(編集-)

これを試して:-

        rowData=[];
        var showFiles = function () {
        var input = document.getElementById('doc-upload');
        if (input.files.length > 0) {
            for (var i = 0; i < input.files.length; i += 1) {
              var f=[];
              for(var j=0;j<rowData.length;j++)
                 f.push(rowData[j][0]);
              if(f.indexOf(input.files[i].name) == -1)
                  rowData.push([input.files[i].name]);
            }
            console.log(rowData);
        };
    };
    document.getElementById('doc-upload').addEventListener('change', showFiles, this);
于 2013-02-06T10:14:19.413 に答える