追加而不是覆蓋

我有這個代碼，我正在努力，我試圖追加而不是覆蓋#preview div。我使用jquery的jqueryForm插件。追加而不是覆蓋

$(document).ready(function() { 
    $('#photoimg').on('change', function() { 
     $("#preview").html('<img src="load.gif" alt="Uploading"/>'); 
     $("#imageform").ajaxForm({ 
     target: '#preview' 
    }).submit(); 

     }); 
    });

我真的不知道我如何實現這一點。

後來編輯：我有這樣的形式：

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

當我瀏覽並選擇圖像的ajaximage.php驗證和上傳的圖片，如果成功，它將反響，在#preview DIV顯示一條消息。問題是即使我使用append它覆蓋div。

來源

2013-04-03 Netra

你然後關閉：

$("#preview").append('<img src="load.gif" alt="Uploading"/>');

這裏的documentation。

編輯：基於您的更新問題，看來，你可能需要動態地創建爲ajaxForm插件使用的目標。這裏有一個例子：

$(document).ready(function() { 
    $('#photoimg').on('change', function() { 
     $("#preview").html('<img src="load.gif" alt="Uploading"/>'); 
     // create a dynamic target that we'll add to #preview 
     var $target = $('<div />').appendTo('#preview'); 
     $target.attr('id', 'preview-target-' + Math.ceil(Math.random()*999999)); 
     $("#imageform").ajaxForm({ 
      // use the new target element's id for the ajaxForm target 
      target: '#' + $target.attr('id') 
     }).submit(); 
    }); 
});

來源

2013-04-03 23:14:40 jmar777

哈哈...短而史詩！ – 2013-04-03 23:15:45

嘿......我最喜歡的一種問題。「我該怎麼做* *？」 – jmar777 2013-04-03 23:16:37

我之前試過這個，並沒有工作。我編輯了主帖，因爲我沒有解釋整個過程。 – Netra 2013-04-03 23:28:38

jmar是對的。

這裏是填充示例命令，以備將來參考。

$('#idoftarget').append('<div>new stuff</div>');

來源

2013-04-03 23:17:41 Raegon

追加而不是覆蓋

回答

相關問題