Question

我正在努力让文件输入预览正常工作。

我有一个jquery脚本，当我正常调用该函数时它可以正常工作。

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

This有效。

但是当我把调用放到同一个函数时，就像跟随

一样

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

   previewImages();

 });

This无效。

我需要写一个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);
    }
}

Answer 2

创建一个prePreviewImages函数，并在第一种方法中使用它。在该函数内部，使用if语句并调用previewImages（）或其他函数。

Answer 3

以下应该做..

 $('#images').change(function(e) {    
         if(e == "some condition"){  // if else goes here
              previewImages(); 
         }else {
            SomeOtherFun();
         }
     });

Answer 4

这两种方式似乎都适用于JSFiddle。你确定它不是 browser compatibility issue？

如果没有，您是否在开发人员工具下的控制台中记录了错误？

无法调用jQuery函数

4 个答案: