Question

我想要什么

我想在不重新加载页面的情况下上传文件，我也想将图像的源链接添加到textarea。

因此，当我按下upload_photo时，图片上传并link添加到textarea。

我想要纯HTML，Javascript | AJAX和PHP。

我有什么

<form action"index.php" method="post" enctype="multipart/form-data">
    <textarea id="textarea" name="text"></textarea>
        <input type="file" name="photo" />
        <input type="submit" name="upload_photo"/>
    <input type="submit" name="post"/>
</form>

示例网站：

http://www.friendfeed.com - 上传文件时页面不会重新加载

我不想要的内容

请避免使用jQuery或任何库API发布解决方案。

Answer 1

这个可以确实可以用AJAX完成。我不认为使用AJAX比发送一个vanilla HTML表单更具安全风险;您必须完全验证服务器端的所有用户输入。这是一个简单的例子：

http://www.webtoolkit.info/ajax-file-upload.html

Answer 2

这很容易。放一个iframe，给它起一个名字，例如“MyIframe”。然后在表单中，添加值为“MyIframe”的TARGET属性和操作 - 上传的脚本（例如takeupload.php）在主页面中定义一个Javascript函数，该函数在上传完成后执行您需要的操作，将使用参数从takeupload.php生成的页面调用。

在takeupload.php中上传图像，然后发送一个普通的空白HTML页面作为输出，该页面将执行一个脚本，该脚本将调用上述方法，并带有一组您需要的参数（图像名称，路径，错误或简单的HTML插入某处等。）。

像这样使用它：

<script type="text/javascript">
parent.YourJSMethod(parameters);
</script>

该页面将加载到iframe中，它将运行在iframe外部定义的函数。上传完成，父页面接收有关结果的数据。

这很简单。不需要jQuery，没有AJAX，没有任何东西，只是一个非常简单的Javascript代码和一些HTML。

使用php上传照片而无需重新加载

2 个答案: