Question

我有一张上传照片的表单。上传后，图片显示在UL LI中。问题是，如果我调出另一张图像，则删除上一张图像并仅显示新图像。非常感谢帮助

的index.php：

        <form name="multiple_upload_form" id="multiple_upload_form" enctype="multipart/form-data" action="image_upload.php">
            <input type="hidden" name="image_form_submit" value="1"/>
            <label>Add new</label>
            <input type="file" name="images[]" id="images" multiple >
            <div class="uploading none">
                <label>&nbsp;</label>
                <img src="images/uploading.gif"/>
            </div>
        </form>

       <div class="gallery" id="images_preview">
          <ul class="reorder_ul reorder-photos-list">
          </ul>
       </div>

JS：

$(document).ready(function(){
$('#images').on('change',function(){
    $('#multiple_upload_form').ajaxForm({
        target:'#images_preview ul',
        beforeSubmit:function(e){
            $('.uploading').show();
        },
        success:function(html){
            $('.uploading').hide();
        },
        error:function(e){
        }
    }).submit();
});
});

image_upload.php：

<?php
  if($_POST['image_form_submit'] == 1)
   {
$images_arr = array();
foreach($_FILES['images']['name'] as $key=>$val){
    $image_name = $_FILES['images']['name'][$key];
    $tmp_name   = $_FILES['images']['tmp_name'][$key];
    $size       = $_FILES['images']['size'][$key];
    $type       = $_FILES['images']['type'][$key];
    $error      = $_FILES['images']['error'][$key];



    $target_dir = "../uploads/";
    $target_file = $target_dir.time().$_FILES['images']['name'][$key];
    if(move_uploaded_file($_FILES['images']['tmp_name'][$key],$target_file)){
        $images_arr[] = $target_file;
    }

    //$extra_info = getimagesize($_FILES['images']['tmp_name'][$key]);
    //$images_arr[] = "data:" . $extra_info["mime"] . ";base64," . base64_encode(file_get_contents($_FILES['images']['tmp_name'][$key]));
}

//Generate images view
if(!empty($images_arr)){ $count=0;
    foreach($images_arr as $image_src){ $count++?>
            <li id="image_li_<?php echo $count; ?>" class="ui-sortable-handle">
                <a href="javascript:void(0);" style="float:none;" class="image_link"><img src="<?php echo $image_src; ?>" alt=""></a>
            </li>
<?php }
}
 }
?>

Answer 1

您可以将旧内容保存在变量中，然后再将其替换为响应：

`

var old;
$('#images').on('change',function(){
    old = $('#images_preview ul').html();
    $('#multiple_upload_form').ajaxForm({
        [...]
        success: function(){
            $('.uploading').hide();
            $('#images_preview ul').append(old);

`

AjaxForm，更新html无法正常工作

1 个答案: