Предварительный просмотр изображения в javascript

Следующий код не работает в Firefox и Chrome, но работает в IE. Может ли кто-нибудь сказать мне, почему он не работает в браузере, кроме IE с решением. Заранее спасибо.Предварительный просмотр изображения в javascript

<html> 
<head> 
<script> 
function hello() 
{ 
    var a=document.getElementById("upload").value; 
    alert(a); 
    document.getElementById("previewIMG").src=a; 
    document.getElementById("previewIMG").style.display="block"; 
} 

</script> 

</head> 
<body> 
<form name="img" enctype="multipart/form-data"> 
<input type="file" name="upload" id="upload" /> 
<input type="button" name="submit" value="Upload Me Now" onClick="javascript:hello();"> 
<img id="previewIMG" src="" style="display:none;" /> 
</form> 
</body> 
</html>

источник

2012-02-28 shahith

Не разрешено для загрузки локального ресурса – mgraph

Добро пожаловать в Stack Overflow! «Не работает» никогда не является хорошим описанием ошибки. Пожалуйста, в будущем, выполните некоторую отладку (* что * точно не работает? Что '' содержит в IE, и что он содержит в FF? И т.д.) Спасибо! –

Есть две проблемы:

Современные браузеры не обнажают полный путь к файлам, выбранным в файле загружать больше. Они показывают что-то вроде этого:

C: \ Fakepath \ Filename.txt

, к сожалению, что уничтожает возможность наличия локального предварительного просмотра изображения.
Современные браузеры не позволяют внедрять локальные ресурсы изображения, также из соображений безопасности, поэтому даже если 1.) не существует, из-за этого это не сработает.

Вам нужно будет использовать альтернативный метод, чтобы получить это, например. Flash-загрузчик, например SWFUpload. Это также снова становится возможным с помощью API файлов HTML 5. Я предполагаю, что вам придется извлекать данные изображения и рисовать их в холст, который является вашим изображением предварительного просмотра.

Редактировать: This jQuery library кажется идеальным путем. Он предоставляет загрузочный объект, поддерживающий API, с функциями предварительного просмотра изображений, которые должны работать во всех современных браузерах (кроме IE). Спасибо @ Shadow Wizard!

источник

2012-02-28 11:15:59

Возможно с HTML5. [См. Также] (http://stackoverflow.com/questions/6750543/show-the-image-preview-before-uploading-it-to-the-server) –

@ Shadow хорошая точка, добавлено. (это, вероятно, не будет абсолютно тривиально делать. Вам понадобится элемент Canvas, чтобы сделать ваш предварительный просмотр ... Интересно, существует ли готовый виджет загрузки, который может это сделать.) –

Вы имеете в виду [like это] (http://blueimp.github.com/jQuery-File-Upload/)? :-) –

Вы не можете предварительно просматривать изображения перед фактической загрузкой изображения на сервер.

Пусть пользователю выбрать изображение для загрузки (.jpg файл, например)
Загрузить файл на сервер с помощью AJAX
Показать миниатюру с помощью AJAX

В step 2 выше вы можете загрузить его во временный каталог на сервере, чтобы его можно было удалить в периодическом режиме очистки.

источник

2012-10-21 16:38:54 Ram

Предварительный просмотр изображения в javascript

ответ

Смежные вопросы