這個是圖片時的預(yù)覽圖
$('input[type=file]').change(function() {
var input = $(this);
if(!!this.files && !!this.files[0]) {
var reader = new FileReader();
reader.onload = function(e) {
$('#pre' + input.prop('id').substr(4,2)).prop('src', e.target.result);
}
reader.readAsDataURL(this.files[0]);
}
});
這是添加影片預(yù)覽圖
$(document).on("change", ".file_multi_video", function(evt) {
var $source = $('#video_here');
$('.video_show').show();
$source[0].src = URL.createObjectURL(this.files[0]);
$source.parent()[0].load();
});
只是當(dāng)初我寫的時候影片上傳和照片上傳是分開的：
<input type="file" name="video" class="file_multi_video upload_cover" accept="video/*">
<video autoplay muted class="video_show displayNone">
<source src="<?=$editBlog['video'];?>" id="video_here">
</video>
所以會有兩個上傳 input只是我現(xiàn)在都寫在同一個
<input type="file" id="file02" name="cover" class="upload_cover" accept="image/jpeg, image/png, image/jpg, video/*">
只是我不知道怎麼整合上傳照片的時候是使用第一個 function如果是影片上傳則是另一個 function 來預(yù)覽？請問能怎麼實現(xiàn)？如何在 input change 中判斷？或有其他更好的方法？
2 回答
瀟湘沐
TA貢獻(xiàn)1816條經(jīng)驗 獲得超6個贊
其實就是根據(jù)文件類型來判斷就可以了。
$('input[type=file]').change(function() {
if(!this.files || !this.files[0]) {
return;
}
var filetype = this.files[0].type;
if(filetype.indexOf('image') > -1) {
//todo 處理圖片
}
if(filetype.indexOf('video') > -1) {
//todo 處理視頻
}
});
30秒到達(dá)戰(zhàn)場
TA貢獻(xiàn)1828條經(jīng)驗 獲得超6個贊
通過 event.files[0].type 判斷，應(yīng)該是 image/* 和 video/*。
- 2 回答
- 0 關(guān)注
- 384 瀏覽
添加回答
舉報
0/150
提交
取消