ajax中的上传图像表单不起作用

Question

你好，我想上传一些图像到我的服务器。当我没有将带有ajax.load的页面加载到另一个页面时，它是有效的。因此，通过直接链接到它，它可以很好地工作。但是我想点击一个链接，打开上传表单并上传图片(所有这些都在一个窗口中)。这是因为页面在上传之前正在刷新，还是另一个问题？不知道怎么解决这个问题。

代码：

<?php
include('includes/connect.php');

if(isset($_POST['uploadImg'])){
$extension = end(explode(".", $_FILES["file"]["name"]));
$name = $_FILES["file"]["name"];

if (file_exists("upload/" . $_FILES["file"]["name"]))
      {
     mysql_query("INSERT INTO images (itemID,imgPath,imgName,imgExtension,imgAlt)               VALUES (".$_POST['itemNumber'].",'upload','".$name."','".$extension."','".$name."')")or die('kan niet uploaden'.mysql_error()); 
      }
    else
      {
      move_uploaded_file($_FILES["file"]["tmp_name"],
      "upload/" . $_FILES["file"]["name"]);
      echo "Uw afbeelding is toegevoegd aan item".$_POST['itemNumber'];
      echo "<a id='uploadNew' href='#'>Nog een item uploaden</a>";
      }                 


mysql_query("INSERT INTO images (itemID,imgPath,imgName,imgExtension,imgAlt)                VALUES (".$_POST['itemNumber'].",'upload','".$name."','".$extension."','".$name."')")or die('kan niet uploaden'.mysql_error());     
}

?>
<form method="post" enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file" />
Toevoegen aan: 
<select name="itemNumber">
<? 
            $result = mysql_query("SELECT * FROM items");
                while($row = mysql_fetch_array($result))
                  {
                      echo '<option name="itemVal" value="'.$row['itemID'].'">'.$row['itemTitle'].'</option>';
                      echo "<br />";
                  }
        ?>
</select>
<input type="submit" name="uploadImg" value="submit" />
</form>

Answer 1

问题来自于表单在AJAX加载之前发送到父页面的事实。您发布的部分页面是通过第二个HTTP请求检索的，并且没有设置任何POST参数。

最好的方法是在加载AJAX的父页面中添加php脚本。还要在表单元素中指定"target“属性，以便跟踪哪个服务器页面正在处理请求。

Answer 2

ajax没有直接上传你的图片，你应该使用一些插件来上传图片，

以前我用过这个插件(ajax.form)来实现即时image upload。

点击链接，在此链接中是一个简单的示例，说明如何使用此插件并上传图像。http://blog.webtech11.com/2012/03/18/ajax-based-instant-image-upload.html