|
 |
| |
JavaScript แสดงรูป Preview ทันที หลังจากที่เลือกรูปก่อนทำการ Upload ไฟล์ |
| |
 |
|
|
 |
 |
|
Code (JavaScript)
<html>
<head>
<title>ThaiCreate.Com Tutorial</title>
</head>
<body>
<form name="frmMain" action="" method="post">
<script language="JavaScript">
function showPreview(ele)
{
document.frmMain.imgAvatar.src=ele.value;
}
</script>
<input type="file" name="filUpload" OnChange="showPreview(this)">
<input type="submit" name="btnSubmit" value="Submit">
<hr>
<img id="imgAvatar">
</form>
</body>
</html>
jQuery
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<script type="text/javascript">
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#blah').attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
</script>
<body>
<form id="form1" runat="server">
<input type='file' onchange="readURL(this);" />
<img id="blah" src="#" alt="your image" />
</form>
</body>
</html>
|
 |
 |
 |
 |
| Date :
2011-06-06 06:21:55 |
By :
webmaster |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
|
|
| |
|
 Load balance : Server 01
|
