无法调用jQuery函数

Question

我想让文件输入预览工作.

我有一个jquery脚本,当我正常调用函数时工作正常.

$('#images').on("change", previewImages);

这有效.

但是当我把调用放到同一个函数时,就像下面这样

 $('#images').on("change", function(){

   previewImages();

 });

这不起作用.

我需要写一个if else statement在else上调用不同的函数.

Answer 1

有效的问题

原因:发生这种情况是因为this当您使用第一种方法时引用文件元素,但是在第二种方法的情况下this引用调用它的窗口元素.所以把它传递给函数,你的问题就解决了.

$('#images').on("change", function(e) {
    /* issue is with this */
    previewImages(e, this);
});

var count = 0;

function previewImages(evt, cur) {
    var $fileUpload = $("input#images[type='file']");
    count = count + parseInt($fileUpload.get(0).files.length);
    if (parseInt($fileUpload.get(0).files.length) > 7 || count > 6) {
        alert("You can only upload a maximum of 6 files");
        count = count - parseInt($fileUpload.get(0).files.length);
        evt.preventDefault();
        evt.stopPropagation();
        return false;
    }
    $("#taskbar").css("height", "auto");
    var $preview = $('#preview').empty();
    if (cur.files) $.each(cur.files, readAndPreview);
    function readAndPreview(i, file) {
        // if (!/\.(jpe?g|png|gif|mp4)$/i.test(file.name)){
        //   return alert(file.name +" is not an image");
        // }
        var reader = new FileReader();
        $('#preview img').addClass('img-responsive');
        $(reader).on("load", function() {
            $preview.append($("<img/>", {
                src: this.result,
                height: 100
            }));
        });
        reader.readAsDataURL(file);
    }
}