1

次のjsfiddleコードを使用して、アップロードされた画像ファイルの属性を決定しています。複数のファイル アップロード要素があります。switch 関数を使用できるように、関数を呼び出した要素の現在の ID を知りたいです。たとえば、id = file1 の場合はこれを行い、それが file2 の場合はこれを行います。$(this).attr("id"), this.id; を使用しました。しかし、どれも機能しません。

$(window).load(function(){
    var _URL = window.URL || window.webkitURL;
    function displayPreview(files) {
        var reader = new FileReader();
        var img = new Image();
        reader.onload = function (e) {
            img.src = e.target.result;
            fileSize = Math.round(files.size / 1024);
            img.onload = function () {
                $('#preview').append('<img src="' + img.src + '">');
            }
        };
    reader.readAsDataURL(files);
    }
    $("#file1").change(function() {
        var file = this.files[0];
        displayPreview(file);
    });
    $("#file2").change(function() {
        var file = this.files[0];
        displayPreview(file);
    });
    $("#file3").change(function() {
        var file = this.files[0];
        displayPreview(file);
    });
});

これはhtmlコードです：

<input type="file" id="file1" /></br>
<input type="file" id="file2" /></br>
<input type="file" id="file3" /></br>
<div id="preview"></div>

では、関数を呼び出した現在の要素の ID を知るにはどうすればよいでしょうか?

4

1 に答える 1

2

イベント ターゲットを使用して、イベント ハンドラー内の要素の ID を取得できます。

$("#file3").change(function(e) {
    var id = e.target.id;
    var file = this.files[0];
    displayPreview(file, id);
});

匿名関数のイベントとして「e」を渡す必要があります。

または、これでjQueryセレクターを使用できます

var id = $(this).attr("id");

ID を取得したら、それをメソッドに渡します。

displayPreview(file, id);
于 2013-11-07T04:30:21.613 に答える