图像上传更改事件的字段

时间:2013-11-18 08:06:20

标签: php jquery html

我正在使用表单动作事件在服务器上加载图像,如何识别方法的返回以便我可以用该图像设置canvas元素的背景图像???

<form id="imageform" class="form-horizontal" action="ajaximage.php" method="post" enctype="multipart/form-data"  >
                            <div class="control-group">
                                <label class="control-label" for="InputImage">Upload Image for Liberary</label>
                                <div class="controls">
                                    <span class="btn btn-file">
                                        <input type="file" name="photoimg" id='fileImage' class="fileUpload" required />
                                        <div  id='preview' style=""></div> <!-- style="width: 90px;" onchange="this.style.width = '100%';"  <div  id='categoryImage' style='border:1px solid black; height:20px' ></div> --> <div  id='libImage' style="display: none"></div> <div  id='preview'></div> </span>
                                </div>
                            </div>
                        </form>

ajaximage.php

$valid_formats = array("jpg", "png", "gif", "bmp");
    if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST")
        {
            $name = $_FILES['photoimg']['name'];
            $size = $_FILES['photoimg']['size'];
            //echo "<script>alert(".$name.")</script>";
            if(strlen($name))
                {
                    list($txt, $ext) = explode(".", $name);
                    if(in_array($ext,$valid_formats))
                    {
                    if($size<(1024*1024))
                        {

                            $actual_image_name = $txt.".".$ext;
                            $tmp = $_FILES['photoimg']['tmp_name'];
                            if(move_uploaded_file($tmp, $path.$actual_image_name))
                                {

                                    echo "<img src='../products/".$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;
        }

1 个答案:

答案 0 :(得分:1)

您可以使用以下代码使用jQuery

来触发更改事件
$("document").ready(function(){

    $("#fileImage").change(function() {
           $( "#imageform" ).submit();
    });


});

或者您也可以使用

$('#fileImage').on("change", function(){ $( "#imageform" ).submit(); });

see Fiddle