87,910
社区成员
发帖
与我相关
我的任务
分享Image的src属性赋值之后，怎么知道这个src是不是真的来自一个图片文件？
<SCRIPT LANGUAGE="JavaScript">
<!--
……
var loadImage = new Image();
loadImage.src = "...";
……
document.all.img.src = loadImage.src;
document.all.img.style.display = "";
//-->
</SCRIPT>
<img name="img" style="display:none" onload="checkPic(this)">
现在有一个问题：如果图片的来源文件是一个真的图片，那么，显示图片没问题。
如果图片的来源不是一个图片文件，例如，用户不小心选择了一个word文件，则显示大片空白加一个小红叉。
现在请问，能否有办法知道，loadImage.src是不是一个图片文件？
如果是，就让img显示，如果不是，就不让img显示。
<!--
……
var loadImage = new Image();
loadImage.src = "...";
……
document.all.img.src = loadImage.src;
document.all.img.style.display = "";
//-->
</SCRIPT>
<img name="img" style="display:none" onload="checkPic(this)">
现在有一个问题：如果图片的来源文件是一个真的图片，那么，显示图片没问题。
如果图片的来源不是一个图片文件，例如，用户不小心选择了一个word文件，则显示大片空白加一个小红叉。
现在请问，能否有办法知道，loadImage.src是不是一个图片文件？
如果是，就让img显示，如果不是，就不让img显示。
...全文
请发表友善的回复…
发表回复
skyearthsea 2008-08-29
- 打赏
- 举报
在你选点选文件的时候 检验 它的后缀后 不是img不准选
woshihuzi 2008-08-29
- 打赏
- 举报
谢谢！
familyX 2008-08-04
- 打赏
- 举报
判断文件的mime格式啊。如果是图片就显示。不是图片就不显示。
bhtfg538 2008-08-04
- 打赏
- 举报
检查他的后缀文件名来判断
ys2001 2008-08-04
- 打赏
- 举报
有一个方法，你看可行不。是当图片出错时，用替代文字。
<img/>标签的SRC属性的路径找不到相应的图片文件时，该标签提供了一个alt属性的值来替代图片的文字。编写格式为
<img src="图片路径" alt="替代文字"/>
<img/>标签的SRC属性的路径找不到相应的图片文件时，该标签提供了一个alt属性的值来替代图片的文字。编写格式为
<img src="图片路径" alt="替代文字"/>
woshihuzi 2008-08-04
- 打赏
- 举报
我是想再上传图片之前，来个预览，所以，用户自己选定图片是必不可少的。所以src是随时变化的，万一用户自己选定了不是图片的文件，我的图片预览就变成红叉了。所以我必须要首先判定src得到的文件路径字符串是不是一个真正的图片。靠扩展名也太麻烦了吧？有没有其他的办法？
我的全部代码如下，请高手帮看看：
upload.html
===================================================================
<SCRIPT LANGUAGE="JavaScript">
<!--
var uploadMaxSize = 100; //规定最大的文件大小，以K为单位
function checkPic(objImg)
{
var image = new Image();
image.src = objImg.src;
if (image.width > 0 && image.height>0)
{
if (image.width > 400)
objImg.width = 400;
else
objImg.width = image.width;
objImg.style.display = "";
var iPicSize = (objImg.fileSize/1024).toFixed(2); // 字节数变成以K为单位的数，除以1024，保留2位小数
if (iPicSize > uploadMaxSize)
{
alert("你选择的上传图片太大（" + iPicSize + "K）\n" + "请重新选择！");
document.frmupload.upload.disabled = true;
}
else
{
document.frmupload.upload.disabled = false;
}
document.frmupload.picsize.value = objImg.fileSize
}
}
//-->
</SCRIPT>
<html>
<head>
<title>图片上传2</title>
</head>
<body>
<form name=frmupload method=post action="upload.asp" onsubmit="alert(document.frmupload.picpath.value);">
<table align=center width="415px" border=1 cellpadding = 0 cellspacing=0 style="font-size:14px; padding:5px 5px 5px 5px" bgcolor="#d0d0d0">
<tr>
<td align=center><p style="font-size:24px"><font color=red>图片上传</font></p></td>
</tr>
<tr>
<td align=left><font color=blue>注意：要上传的图片大小不要超过1M。另外，如果上传图片的宽度超过400px，一律按照宽度为400px进行预览，图片的高度将按比例进行缩放。如果图片的宽度小于400px，则按原宽度预览。</font></td>
</tr>
<tr>
<td>请选择一个图片：</td>
</tr>
<tr>
<td>
<input type="file" style="width:350px;height:20px" name="picpath" onchange="document.all.img.src=this.value">
<button type="submit" name=upload disabled style="width:50px;height:20px">上传</button>
</td>
<tr>
<td align=center>
<input type="hidden" value="" name="picsize">
<img name="img" style="display:none" onload="checkPic(this)">
</td>
</tr>
</table>
</form>
<br>
</body>
</html>
我的全部代码如下，请高手帮看看：
upload.html
===================================================================
<SCRIPT LANGUAGE="JavaScript">
<!--
var uploadMaxSize = 100; //规定最大的文件大小，以K为单位
function checkPic(objImg)
{
var image = new Image();
image.src = objImg.src;
if (image.width > 0 && image.height>0)
{
if (image.width > 400)
objImg.width = 400;
else
objImg.width = image.width;
objImg.style.display = "";
var iPicSize = (objImg.fileSize/1024).toFixed(2); // 字节数变成以K为单位的数，除以1024，保留2位小数
if (iPicSize > uploadMaxSize)
{
alert("你选择的上传图片太大（" + iPicSize + "K）\n" + "请重新选择！");
document.frmupload.upload.disabled = true;
}
else
{
document.frmupload.upload.disabled = false;
}
document.frmupload.picsize.value = objImg.fileSize
}
}
//-->
</SCRIPT>
<html>
<head>
<title>图片上传2</title>
</head>
<body>
<form name=frmupload method=post action="upload.asp" onsubmit="alert(document.frmupload.picpath.value);">
<table align=center width="415px" border=1 cellpadding = 0 cellspacing=0 style="font-size:14px; padding:5px 5px 5px 5px" bgcolor="#d0d0d0">
<tr>
<td align=center><p style="font-size:24px"><font color=red>图片上传</font></p></td>
</tr>
<tr>
<td align=left><font color=blue>注意：要上传的图片大小不要超过1M。另外，如果上传图片的宽度超过400px，一律按照宽度为400px进行预览，图片的高度将按比例进行缩放。如果图片的宽度小于400px，则按原宽度预览。</font></td>
</tr>
<tr>
<td>请选择一个图片：</td>
</tr>
<tr>
<td>
<input type="file" style="width:350px;height:20px" name="picpath" onchange="document.all.img.src=this.value">
<button type="submit" name=upload disabled style="width:50px;height:20px">上传</button>
</td>
<tr>
<td align=center>
<input type="hidden" value="" name="picsize">
<img name="img" style="display:none" onload="checkPic(this)">
</td>
</tr>
</table>
</form>
<br>
</body>
</html>
bhtfg538 2008-08-04
- 打赏
- 举报
one
这里不要加
不然有语法错误吧
LS
这里不要加
不然有语法错误吧
LS
MyTools_Studio 2008-08-04
- 打赏
- 举报
you can try this one
<img src="Some invalid Url" onerror="this.style.display='none'" />
<img src="http://www.csdn.net/Images/logo_csdn.gif" onerror="this.style.display='none'" />
