مشکل با آپلود عکس

[farnaz.saeedi]

با سلام
دوستان من یه فرم آپلود دارم به این شکل:


<div style="margin-right:120px">
<img src="123.jpg" id="avatar" width="130" height="150"/>
</div>
<div class="upload">
<form enctype="multipart/form-data">
<input type="file" name="up" id="upload" onchange="upload()"/>
</form>
</div>
میخام وقتی کاربر یه عکس و انتخاب کرد اون عکس تو تگ img نشون داده بشه
اینم کد جاوااسکریپت:

function upload()
{
var src=document.getElementById('upload').value;
$('img#avatar').attr("src","src");
}

الان این کد کار نمیکنه چون متغییر src فقط نام عکس و برمیگردونه نه مسیر عکس انتخاب شده توسط کاربر رو
چطوری باید مسیر عکسو بگیرم بعد اونو بزارم تو تگ img ؟

[plague]

باید iframe استفاده کنی شما نمیتونی وقتی عکس هنوز آپلود نشده با جاوااسکریپت بگیری و نشونش بدی
باید اول آپلود بشه

[exlord]

/**
* Created by JetBrains PhpStorm.
* User: Exlord
* Company: AzarIPT
* Date: 9/21/11
* Time: 11:30 AM
*/
var maxWidth = 500;
// height to resize large images to
var maxHeight = 500;
// valid file types
var fileTypes = ["gif","png","jpg","jpeg"];
// the id of the preview image tag
var outImage = "ctl00_cphLeft_img1";
// what to display when the image is not valid
var defaultPic = my_site_base_url+"img/no_image.png";
/***** DO NOT EDIT BELOW *****/
function preview(what) {
var source = what.value;
var ext = source.substring(source.lastIndexOf(".") + 1, source.length).toLowerCase();
for (var i = 0; i < fileTypes.length; i++) {
if (fileTypes[i] == ext) {
break;
}
}
globalPic = new Image();
if (i < fileTypes.length) {

try {
globalPic.src = what.files[0].getAsDataURL();
} catch(err) {
globalPic.src = source;
}
} else {
globalPic.src = defaultPic;
}
setTimeout("applyChanges()", 1000);
}

var globalPic;
function applyChanges() {
var field = document.getElementById(outImage);
var x = parseInt(globalPic.width);
var y = parseInt(globalPic.height);
if (x > maxWidth) {
y *= maxWidth / x;
x = maxWidth;
}
if (y > maxHeight) {
x *= maxHeight / y;
y = maxHeight;
}
field.style.display = (x < 1 || y < 1) ? "none" : "";
field.src = globalPic.src;
field.width = x;
field.height = y;
}

[farnaz.saeedi]

/**
* Created by JetBrains PhpStorm.
* User: Exlord
* Company: AzarIPT
* Date: 9/21/11
* Time: 11:30 AM
*/
var maxWidth = 500;
// height to resize large images to
var maxHeight = 500;
// valid file types
var fileTypes = ["gif","png","jpg","jpeg"];
// the id of the preview image tag
var outImage = "ctl00_cphLeft_img1";
// what to display when the image is not valid
var defaultPic = my_site_base_url+"img/no_image.png";
/***** DO NOT EDIT BELOW *****/
function preview(what) {
var source = what.value;
var ext = source.substring(source.lastIndexOf(".") + 1, source.length).toLowerCase();
for (var i = 0; i < fileTypes.length; i++) {
if (fileTypes[i] == ext) {
break;
}
}
globalPic = new Image();
if (i < fileTypes.length) {

try {
globalPic.src = what.files[0].getAsDataURL();
} catch(err) {
globalPic.src = source;
}
} else {
globalPic.src = defaultPic;
}
setTimeout("applyChanges()", 1000);
}

var globalPic;
function applyChanges() {
var field = document.getElementById(outImage);
var x = parseInt(globalPic.width);
var y = parseInt(globalPic.height);
if (x > maxWidth) {
y *= maxWidth / x;
x = maxWidth;
}
if (y > maxHeight) {
x *= maxHeight / y;
y = maxHeight;
}
field.style.display = (x < 1 || y < 1) ? "none" : "";
field.src = globalPic.src;
field.width = x;
field.height = y;
}

من که هیچی از این کد نفهمیدم.یه توضیح میدادید بد نبود

[farnaz.saeedi]

دوستان کسی نمیتونه کمک کنه؟

[رضا قربانی]

مشکل با آپلود کردن عکس داری یا مشکل با نمایش عکس ؟

اینطور که من متوجه شدم اینه که طرف وقتی می خواد بیاد و عکسی انتخاب کنه تا آپلود شه ، بعد اینکه عکس رو انتخاب کرد سریع عکس نمایش داده بشه ، و بعد وقتی روی آپلود زدی تصویر در مکان خاص آپلود بشه . درسته ؟ همچین چیزی می خوایی ؟

[Arthas1990]

با سلام
دوستان من یه فرم آپلود دارم به این شکل:


<div style="margin-right:120px">
<img src="123.jpg" id="avatar" width="130" height="150"/>
</div>
<div class="upload">
<form enctype="multipart/form-data">
<input type="file" name="up" id="upload" onchange="upload()"/>
</form>
</div>
میخام وقتی کاربر یه عکس و انتخاب کرد اون عکس تو تگ img نشون داده بشه
اینم کد جاوااسکریپت:

function upload()
{
var src=document.getElementById('upload').value;
$('img#avatar').attr("src","src");
}

الان این کد کار نمیکنه چون متغییر src فقط نام عکس و برمیگردونه نه مسیر عکس انتخاب شده توسط کاربر رو
چطوری باید مسیر عکسو بگیرم بعد اونو بزارم تو تگ img ؟

سلام .
حرکت قشنگیه اینکه قبل از آپ کردن پیش نمایش بدی . لینک زیر رو نگاه کن :
http://forums.asp.net/t/1668581.aspx/1
url_parser رو لینک کن تو صفحه ات و
path فایل اینپوتت رو بریز جای src عکست ، زمان تغییر فایل اینپوتت
امیدوارم کمکی کرده باشم

[رضا قربانی]

سلام .
حرکت قشنگیه اینکه قبل از آپ کردن پیش نمایش بدی . لینک زیر رو نگاه کن :
http://forums.asp.net/t/1668581.aspx/1
url_parser رو لینک کن تو صفحه ات و
path فایل اینپوتت رو بریز جای src عکست ، زمان تغییر فایل اینپوتت
امیدوارم کمکی کرده باشم


امکانش هست آماده و اینجا ضمیمه کنید .
با تشکر

[narsic]

دوست عزیز چنین امکانی وجود داره و کد اصلی هم همون کدی هست که exlord دادن (که البته کپی رایت کد رو رعایت نکردن)
و لینک اون کد به همراه نسخه تست رو میتونید در لینک زیر ببینید
http://javascriptsource.com/forms/image-upload-preview.html
البته این لینک تنها با مرورگر IE درست کار میکنه و اما امکان همسان سازی وجود داره اطلاعات دیگه ایی هم مانند حجم فایل رو هم میتونید به دست بیارید
موفق باشید