有時候我們會想在上傳時，就即刻預覽我們剛剛上傳的檔案是否正確，我們可以用以下的JS達成。

$("#upl").change(function () {

        preview(this); //當input file發生改變時，也就是有檔案的選擇時 執行preview

});

function preview(input) {

        if (input.files && input.files[0]) {

            var reader = new FileReader();

            // 當讀取完成後觸發

            reader.onload = function (e) {

                $('.preview').attr('src', e.target.result);

                // 將讀取好檔案顯示在要顯示的Img標籤中。


          }

            //如果上傳的不是圖片檔

            if (!input.files[0].type.match('image.*')) {

                alert("only upload image");

                $(input).val(""); //清空file input 表單送出時才會沒東西

                return;

            }

            reader.readAsDataURL(input.files[0]);

        }

    }