javascript 選擇路徑自動顯示圖片
來源:互聯網
上載者:User
<html>
<head>
<title>test upload picture</title>
<script language="javascript">
function testviewpic(mypic,imgfilepath)
{
var myflag=0; //進行篩選的圖片的副檔名
var aa = ".gif|.jpg|.jpeg|.bmp|.png"; //分離出可以通過的圖片副檔名
var bb = aa.split('|'); //進行迴圈判斷,路經是否為圖片
for(var i=0;i<bb.length;i++)
{
//檢索路徑是否含有指定圖片的副檔名
var cc = imgfilepath.value.toLowerCase().indexOf(bb[i]);
if (cc > 0)
{
//當圖片的路經中含有指定的副檔名時,對狀態進行賦值
myflag=1; mypic.src=imgfilepath.value; mypic.style.display=""; mypic.border=1; break;
}
}
//如果狀態為錯誤,彈出資訊框
if(myflag == 0)
{
alert("current path not picture"); //清除上傳框的路徑值
imgfilepath.outerHTML = imgfilepath.outerHTML; imgfilepath.value=""; mypic.src=""; mypic.style.display="none";
}
}
</script>
</head>
<body>
<form id="form1">
<table>
<tr>
<td class="tdLeft">圖片上傳:</td>
<td><INPUT id="img_upload" type="file" runat="server" onchange="testviewpic(showimg,this.form.img_upload);"> </td> </tr>
<tr> <td class="tdLeft"></td> <td><img id="showimg" alt="" src="" style="display:none"></td> </tr> </table>
</form>
</body>
</html>