Question

我有一个有效的评论框，但想添加上传图片的选项。然后，图像将显示在像facebook这样的底部文本区域中。

页面member-index.php上的代码是：

 <form action="../login/comment-exec.php" method="POST">
    <textarea name="comment" id="feeds" rows="5"  ></textarea>
<input type="hidden" value="<?php $_SESSION['SESS_MEMBER_ID']?>" name="members_id" />
    <input type="submit"  class="postbutton" name="submit" value="Post" />
    </form>

单击提交按钮后，将其发送到PHP页面，将其上传到Mysql 我如何将图像上传器集成到这个Textarea。

Answer 1

您需要在表单中添加：

<input type="file" name="imagefile"> 和你的enctype="multipart/form-data"

<强>即：
<form action="../login/comment-exec.php" method="POST" enctype="multipart/form-data">

然后在表单处理程序的某处：

$allowed_filetypes = array('.jpg','.gif','.bmp','.png'); // These will be the types of file that will pass the validation.
$max_filesize = 9999999999; // Maximum filesize in BYTES - SET IN to a low number for small files
$upload_path = './uploads/'; // The place the files will be uploaded to (currently a 'files' directory).

$filename = $_FILES['imagefile']['name']; // Get the name of the file (including file extension).
$ext = substr($filename, strpos($filename,'.'), strlen($filename)-1); // Get the extension from the filename.

// Check if the filetype is allowed, if not DIE and inform the user.
if(!in_array($ext,$allowed_filetypes))
die('The file you attempted to upload is not allowed.');

// Now check the filesize, if it is too large then DIE and inform the user.
if(filesize($_FILES['imagefile']['tmp_name']) > $max_filesize)
die('The file you attempted to upload is too large.');

// Check if we can upload to the specified path, if not DIE and inform the user.
if(!is_writable($upload_path))
die('You cannot upload to the specified directory, please CHMOD it to 777.');

// Upload the file to your specified path.
if(move_uploaded_file($_FILES['imagefile']['tmp_name'],$upload_path . $filename))

// Echo success and the uploaded file.
echo 'Your file upload was successful, view the file <img src="' . $upload_path . $filename . '" title="Anything you want">'; // It worked.
else
echo 'There was an error during the file upload. Please try again.'; // It failed

// rest of your code to be placed below

数据库注意：为了在数据库中插入上传的文件或对它的引用，图像文件本身可能需要在整个过程中重命名，或者设置一个唯一的ID 。我在这个领域没有任何专业知识，但我知道你的记录必须是独一无二的。

例如，人们从iPod Touch或iPhone等上传JPG。图像的默认名称为image.jpg。从这些设备上传图像但未重命名的任何人都会自动覆盖之前上传的image.jpg;只是值得深思。

Answer 2

不完全确定将数据嵌套到textarea中，但这里有一组很好的图像/文件上传脚本可能会有所帮助。

http://www.w3schools.com/php/php_file_upload.asp

您总是可以对此脚本运行ajax调用，该脚本将上传结果加载到textarea ...或文本区域下方的div，以向用户显示他们上传的内容。希望它有所帮助...

Answer 3

如果你像facebook那样做的话，你不想在表格的同时发送文件。当您将图片上传到Facebook（或大多数热门网站）时，它实际上会在提交表单的文本部分之前将图像上传到他们的服务器。

有几种方法可以做到这一点，将它添加到代码中的最简单方法是使用HTML5 FileReader类（https://developer.mozilla.org/en-US/docs/Web/API/FileReader），它所做的是加载base64编码版本的内容file，将其设置为表单中的字段，然后在另一端构造文件。

<form action="../login/comment-exec.php" method="POST"> <textarea name="comment" id="feeds" rows="5" ></textarea> <input type="hidden" value="<?php $_SESSION['SESS_MEMBER_ID']?>" name="members_id" /> <input type="hidden" name="filedata" value="" /> <input type="file" onchange="loadFile(event);" /> <input type="submit" class="postbutton" name="submit" value="Post" /> </form>

对于更改中的loadFile事件，您需要查看FileReader，它非常简单，但有点太长，不能举一个示例，这里有一个很棒的链接，它也支持拖放：http://www.html5rocks.com/en/tutorials/file/dndfiles/

带有图像上传器的HTML Textarea

3 个答案: