1

我正在寻找一种更灵活的 JavaScript 方式（不是 JQ 或添加的库）来做同样的事情，你可以在下面的 HTML 中看到：

<form action="images.php" method="post" enctype="multipart/form-data">
    <label for="file">Filename:</label>
    <input type="file" name="file" id="file"><br>
    <input type="submit" name="submit" value="Submit">
</form>

我在 JavaScript 中需要它，因为在 JavaScript 中，我还可以在帖子消息正文中发出额外的参数。我想做一些会提醒以下事情的事情（部分伪代码）：

HTML：

<a onclick=addImage()> Add your photo </a>

JavaScript：

function addImage(){

var image = <functionality to open file browser to choose image to send>

var xmlhttp;



if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.onreadystatechange=function()
{
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
       //page.reload();
    }
}


   xmlhttp.open("POST",urlPHP + "images.php",true);
   xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
   xmlhttp.send(image);


}
4

1 回答 1

0

有很多演示可以为您提供源代码：

拖放示例：http ://html5demos.com/file-api

表单示例：http ://www.script-tutorials.com/pure-html5-file-upload/

请注意，对于较旧的浏览器，您仍然必须使用 JS 以外的东西。

于 2013-07-07T15:01:56.410 回答