Question

我想上传没有刷新页面的图片。请为此帮助我。我发现很多东西但是

Answer 1

完整脚本：

你需要ajax来做这件事，这里有一些代码适合你：

ajaximage.php

包含PHP代码此脚本可帮助您将图像上载到uploads文件夹中。
图像文件名重命名为timestamp + session_id.extention

<?php

include('db.php');

session_start();

$session_id='1'; // User session id

$path = "uploads/";

$valid_formats = array("jpg", "png", "gif", "bmp","jpeg");

if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST") {
  $name = $_FILES['photoimg']['name'];
  $size = $_FILES['photoimg']['size'];
  if(strlen($name)) {
    list($txt, $ext) = explode(".", $name);
    if(in_array($ext,$valid_formats)) {
      if($size<(1024*1024)) // Image size max 1 MB
      {
        $actual_image_name = time().$session_id.".".$ext;
        $tmp = $_FILES['photoimg']['tmp_name'];

        if(move_uploaded_file($tmp, $path.$actual_image_name)) {
          mysql_query("UPDATE users SET profile_image='$actual_image_name' WHERE uid='$session_id'");
          echo "<img src='uploads/".$actual_image_name."' class='preview'>";
        }
        else
          echo "failed";
      }
      else
        echo "Image file size max 1 MB";
    }
    else
      echo "Invalid file format..";
  }
  else
    echo "Please select image..!";
  exit;
}
   ?>

index.php

包含简单的PHP和HTML代码。
这里$ session_id = 1表示用户id会话值。

<?php
include('db.php');
session_start();
$session_id='1'; // User login session value
?>




<form id="imageform" method="post" enctype="multipart/form-data" action='ajaximage.php'>

  Upload image <input type="file" name="photoimg" id="photoimg" />

</form>

<div id='preview'>
</div>

用户的示例数据库设计。

用户包含用户详细信息username，password，email，profile_image和profile_image_small等。

CREATE TABLE `users` (
`uid` int(11) AUTO_INCREMENT PRIMARY KEY,
`username` varchar(255) UNIQUE KEY,
`password` varchar(100),
`email` varchar(255) UNIQUE KEY,
`profile_image` varchar(200),
`profile_image_small` varchar(200),
)

Javascript代码

$("#photoimg").live('change',function(){}) 
// photoimg is the ID name of INPUT FILE tag and 

$('#imageform').ajaxForm()
//imageform is the ID name of FORM. While changing INPUT it calls FORM submit without refreshing page using ajaxForm() method.  

<script type="text/javascript" src="http://ajax.googleapis.com/
ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript" src="jquery.form.js"></script>
<script type="text/javascript">
  $(document).ready(function()
  {
    $('#photoimg').live('change', function()
    {
      $("#preview").html('');
      $("#preview").html('<img src="loader.gif" alt="Uploading...."/>');
      $("#imageform").ajaxForm(
      {
        target: '#preview'
      }).submit();
    });
  });
</script>

Answer 2

在没有页面刷新的情况下将文件上载到服务器需要一些额外的客户端工具。然后，这些工具需要与您编写的PHP后端进行通信。以下是一些流行的解决方案，可以满足您的需求：

Uploadify，我最喜欢的解决方案：http://www.uploadify.com/
SWFUpload，类似于Uploadify：http://swfupload.org/
jQuery Form Plugin，一个基于AJAX的上传器：http://jquery.malsup.com/form/#file-upload

希望有所帮助。

Answer 3

两个很好的教程：

http://www.9lessons.info/2011/08/ajax-image-upload-without-refreshing.html

http://css-tricks.com/6522-ajax-image-uploading/

Answer 4

您需要使用ajax来执行此操作。 Ajax会将请求发送到PHP脚本，该脚本将在不刷新整个页面的情况下完成工作。

Answer 5

通过XMLHttpRequest提交。简而言之，您需要初始化FormData()对象并将file附加到对象，然后启动xhr连接，并通过xhr xhr.send发送您的对象。这一切都在非常基本级别......

或者，更好的是，使用预先存在的工具。

Answer 6

有很多jquery插件可用，你也可以显示进度条。参考这个

http://www.phpletter.com/Demo/AjaxFileUpload-Demo/

在php中上传图像而不刷新页面

6 个答案: