1

我正在使用以下 jsfiddle 代码来确定上传的图像文件的属性。有多个文件上传元素。我想知道调用该函数的元素的当前 id，以便我可以使用 switch 函数。例如，如果 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 回答