上传图片后,从浏览窗口中选择图片后自动提交表格

时间:2013-10-22 04:18:26

标签: jquery image upload

我想上传图片,并希望将该图片存储在数据库中。但是当我点击图片打开浏览文件对话框时,表单已经提交。但是我想在选择图片后提交表单。

enter image description here

这是我的代码

<form>

<input type="file" id="my_file" style="display:none;" />
<input type="image" src="albert-einstein-bike.jpg" width="90px" height="200" />
</form>

 <script>

$("input[type='image']").click(function() {
$("input[id='my_file']").click();
});
</script>

1 个答案:

答案 0 :(得分:4)

希望像这样的东西可以为你配对......:)

html

<div id='preview'></div>
    <form id="imageform" method="post" enctype="multipart/form-data" action='ajaximage.php'>
    <input type="file" name="photoimg" id="photoimg" />
     </form>

脚本文件

$('#photoimg').on('change', function() 
 {
      $("#imageform").ajaxForm({target: '#preview', //Shows the response image in the div named preview 
         success:function(){

         }, 
         error:function(){

          } 
       }).submit();
});

ajaximage.php

if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST")
{
$name = $_FILES['photoimg']['name'];
$size = $_FILES['photoimg']['size'];
$tmp = $_FILES['photoimg']['tmp_name'];
$path = "uploads/";
move_uploaded_file($tmp, $path.$name) //Stores the image in the uploads folder
}