在Firefox和Chrome中上传图片

Abd*_*auf 3 javascript html5

<html>

<body>

   <form name="Upload" enctype="multipart/form-data" method="post">

         Filename: <INPUT type="file" id="submit">

         <INPUT type="button" id="send" value="Upload">

    </form>

    <div id="div" align="center" style="height: 200px;width: 500px;border-style: ridge;border-color: red"></div>

</body>

<script type="text/javascript">



var img_id=0

var image = new Array()

document.getElementById('send').onclick=function()

{

    img_id++

    var id="imgid"+img_id

    image = document.getElementById('submit').value;

    document.getElementById('div').innerHTML="<img id='"+id+"' src='"+image+"' width=500px height=200px>"



}



</script>



</html>
Run Code Online (Sandbox Code Playgroud)

这段代码的问题是它只能在IE中工作而不能在其他浏览器中工作(firefox,chrome,等等).

编辑:(更新我的帖子以回应Naren,Bitslitter的)伙计们,这里的文字将添加到下面发布的讨论中:

谢谢大家的反馈,Naren和Bitslitter的反馈绝对具有启发性.

您能否请您推荐如何实现我想要做的事情:

在我的Web应用程序中,有一个按钮,在单击按钮时,出现浏览器打开对话框,询问图像文件,用户选择图像,图像在Web应用程序中打开.对我来说,让浏览器从本地服务器打开图像非常重要,因为我想使用HTML5 canvas标签来读取像素,然后动态地将这些像素转换为SVG(使用JS).这一切听起来都应该比它应该更复杂.

像Mugtug的Darkroom(http://mugtug.com/darkroom/)这样的Web应用程序已经能够实现我想要的目标.

Bit*_*ter 5

我在谷歌浏览器中加载页面,上传图像并按Ctrl + Shift + J,您将在错误控制台上看到错误消息"不允许加载本地资源".你可以使用Firebug在FireFox中做类似的事情.除非您的互联网安全级别设置为中等,否则IE不会显示本地资源.Chrome和FireFox根本不会显示本地资源中的内容.