Javascript 在ajax php中上载时未显示图像

Javascript 在ajax php中上载时未显示图像,javascript,php,jquery,ajax,Javascript,Php,Jquery,Ajax,我尝试使用ajax在php中上载图像(不刷新页面),但当我上载图像时,图像路径成功存储在数据库中,图像路径也存储在我的目录中,但上载图像未显示在页面上。我认为Ajax响应有问题,但我不知道问题出在哪里。请帮帮我。。下面是我到目前为止所做的代码 HTML <div id="company_avatar"> <img src="img/comp_avatar.png" /> <form action="processupload.php

我尝试使用ajaxphp中上载图像(不刷新页面),但当我上载图像时,图像路径成功存储在数据库中,图像路径也存储在我的目录中,但上载图像未显示在页面上。我认为Ajax响应有问题,但我不知道问题出在哪里。请帮帮我。。下面是我到目前为止所做的代码

HTML

     <div id="company_avatar">

      <img src="img/comp_avatar.png" />

    <form action="processupload.php" method="post" enctype="multipart/form-data" id="MyUploadForm">
        <input name="image_file" id="imageInput" type="file" />
        <input type="submit"  id="submit-btn" value="Upload" />
        <img src="img/ajax-loader.gif" id="loading-img" style="display:none;" alt="Please Wait"/>
            </form>

    <div id="output"></div>

        </div>
PHP(Processupload.PHP)


我认为您可能希望将代码简化为该问题的基本示例。这将使您的问题得到更多的关注。另外,我认为您不想在服务器上将绝对路径添加到src标记:
。只有在与Web服务器相同的计算机上打开此HTML时,才能看到图像。相反,插入一个相对于网站根目录(或添加此标记的页面)的虚拟路径,例如:
@AndrewSimontsev非常感谢。它解决了我的问题。。谢谢
$(document).ready(function() { 
    var options = { 
            target: '#output',   // target element(s) to be updated with server response 
            beforeSubmit: beforeSubmit,  // pre-submit callback 
            success: afterSuccess,  // post-submit callback 
            resetForm: true        // reset the form after successful submit 
        }; 

     $('#MyUploadForm').submit(function() { 
            $(this).ajaxSubmit(options);            
            // always return false to prevent standard browser submit and page navigation 
            return false; 
        }); 
}); 

function afterSuccess()
{
    $('#submit-btn').show(); //hide submit button
    $('#loading-img').hide(); //hide submit button

}
<?php

              session_start();       
              include_once("core/init.php");
              $user = new users();

              $db = db::getInstance();  
              $pdo = $db->getConnection(); 

              $user_id = $_SESSION['user_session'];
              $stmt = $pdo->prepare("SELECT * FROM registeration WHERE user_id=:user_id");
              $stmt->execute(array(":user_id"=>$user_id));
              $userRow=$stmt->fetch(PDO::FETCH_ASSOC);
              $username = $userRow['username'];

############ Configuration ##############
$thumb_square_size      = 200; //Thumbnails will be cropped to 200x200 pixels
$max_image_size         = 250; //Maximum image size (height and width)
$thumb_prefix           = "thumb_"; //Normal thumb Prefix
$destination_folder     = 'C:/wamp/www/Trade_Ally_v1.1/Company_logos/'; //upload directory ends with / (slash)
$jpeg_quality           = 90; //jpeg quality
##########################################

//continue only if $_POST is set and it is a Ajax request
if(isset($_POST) && isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest'){

    // check $_FILES['ImageFile'] not empty
    if(!isset($_FILES['image_file']) || !is_uploaded_file($_FILES['image_file']['tmp_name'])){
            die('Image file is Missing!'); // output error when above checks fail.
    }

    //uploaded file info we need to proceed
    $image_name = $_FILES['image_file']['name']; //file name
    $image_size = $_FILES['image_file']['size']; //file size
    $image_temp = $_FILES['image_file']['tmp_name']; //file temp

    $image_size_info    = getimagesize($image_temp); //get image size

    if($image_size_info){
        $image_width        = $image_size_info[0]; //image width
        $image_height       = $image_size_info[1]; //image height
        $image_type         = $image_size_info['mime']; //image type
    }else{
        die("Make sure image file is valid!");
    }

    //switch statement below checks allowed image type 
    //as well as creates new image from given file 
    switch($image_type){
        case 'image/png':
            $image_res =  imagecreatefrompng($image_temp); break;
        case 'image/gif':
            $image_res =  imagecreatefromgif($image_temp); break;           
        case 'image/jpeg': case 'image/pjpeg':
            $image_res = imagecreatefromjpeg($image_temp); break;
        default:
            $image_res = false;
    }

    if($image_res){
        //Get file extension and name to construct new file name 
        $image_info = pathinfo($image_name);
        $image_extension = strtolower($image_info["extension"]); //image extension
        $image_name_only = strtolower($image_info["filename"]);//file name only, no extension

        //create a random name for new image (Eg: fileName_293749.jpg) ;
        $new_file_name = $username. '_' .  rand(0, 9999999999) . '.' . $image_extension;

        //folder path to save resized images and thumbnails
        $thumb_save_folder  = $destination_folder . $thumb_prefix . $new_file_name; 
        $image_save_folder  = $destination_folder . $new_file_name;


        //call normal_resize_image() function to proportionally resize image
        if(normal_resize_image($image_res, $image_save_folder, $image_type, $max_image_size, $image_width, $image_height, $jpeg_quality))
        {
            //call crop_image_square() function to create square thumbnails
            if(!crop_image_square($image_res, $thumb_save_folder, $image_type, $thumb_square_size, $image_width, $image_height, $jpeg_quality))
            {
                die('Error Creating thumbnail');
            }

            /* We have succesfully resized and created thumbnail image
            We can now output image to user's browser or store information in the database*/

            // Inserting Image Path in Database
              $upload_result = $user->company_images($user_id,$new_file_name);

            echo '<div align="center">';
            echo '<img src="C:/wamp/www/Trade_Ally_v1.1/Company_logos/'.$thumb_prefix . $new_file_name.'" alt="Thumbnail">';
            echo '<br />';
            echo '<img src="C:/wamp/www/Trade_Ally_v1.1/Company_logos/'. $new_file_name.'" alt="Resized Image">';
            echo '</div>';

            echo "hello";
        }

        imagedestroy($image_res); //freeup memory
    }
}