动态图像上传和大图像悬停

时间:2013-11-22 02:01:36

标签: javascript php jquery yoxview

我有一个页面应该动态上传照片,然后将它们显示为缩略图。基本上,这包含两个文件:unit_edit.phpupload.php。我的上传工作正常,因此我不打扰发布它。它将上传的图像放在适当的文件夹中,并将缩略图放在适当的大小。

我的问题是,一旦上传图片就不会显示图片 - 我必须刷新页面。此外,显示较大图像的悬停也不起作用。我正在使用YoxView,它在控制台中显示我的错误 - 未捕获的ReferenceError:未定义选项我必须将其注释掉才能使上传正常工作。我不知道如何定义选项。我尝试按照installation guide进行操作,但无效。这是我的相关代码:

以下是创建和放置照片的div

<div class="editunitimages">
        <form id="imageform" method="post" enctype="multipart/form-data" action='upload.php?id=<?php print $_GET['id']; ?>' >
            Upload image <input type="file" name="photoimg" id="photoimg" />
        </form>

        <div id='preview'>
        </div>
        <div id="unit_images">
            <?php
                require_once('config/db.php');
                $con = mysqli_connect(DB_HOST, DB_USER, DB_PASS, DB_NAME);
                $query = "SELECT id, image FROM images WHERE unit = ".$_GET['id']."";
                $result = mysqli_query($con, $query);
                echo '<div class="yoxview">';
                $i = 1;
                while ($row = mysqli_fetch_assoc($result))
                {
                    echo '<a href="unit_images/'.$row['image'].'"><img src="unit_images/thumbnails/'.$row['image'].'" alt="'.$i.'" title="image '.$i.'" /></a>';
                    $i++;
                }
                echo '</div>';
            ?>
        </div>
    </div>  <!-- end editunitimages -->

这是javascript

<script>
$(document).ready(function() 
{ 
    //$("#thumbnails").yoxview([options]);
    $('#photoimg').live('change', function()    
    { 

        $("#preview").html('');
        $("#preview").html('<img src="images/loader.gif" alt="Uploading...."/>');
        $("#imageform").ajaxForm({
            target: '#preview'
        }).submit();
    });
}); 
</script>

0 个答案:

没有答案