folder Tahribat.com Forumları
linefolder Html - CSS - XML - JavaScript - Ajax
linefolder Jquery Upload Previewer ?



Jquery Upload Previewer ?

  1. KısayolKısayol reportŞikayet pmÖzel Mesaj
    TheMayk
    TheMayk's avatar
    Kayıt Tarihi: 18/Mart/2013
    Erkek

    Yaptığım bir scripte , güncelleme sayfasında kayıtlı resimi değiştirken ön izleme kullanmak istiyorum, çalışıyor fakat ben daha önce yüklenmiş veritabanına kayıtlı resimin yerine almasını istiyorum sonrasında post edeceğim, ön izleme resimi aşağıya çıkıyor.kurcaladım div falan fakat çözemedim.

     

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
 

<div class="upload1-preview">
<div class="image">
		<img src="http://www.izmirhaberajansi.com/images/upload/rus-manken.jpg" alt="Test" style="outline: 0px; list-style-type: none; font-style: normal; font-size: 12px; font-family: inherit; color: inherit; text-decoration: none; vertical-align: top; resize: none; width: 177px; max-width: 100%; height: 120px; display: block; box-shadow: rgba(0, 0, 0, \'0.298039) 0px 1px 2px 0px\'; -webkit-box-shadow: rgba(0, 0, 0, \'0.298039) 0px 1px 2px 0px\'; transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; border: 0px none; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 8px; padding: 0px; background:">
</div>
</div>

<div class="upload">
<input class="file1" name="file_resimi" type="file"  />
</div>


<script type="text/javascript">
 
$(document).ready(function(){
var preview = $(".upload1-preview");
 
$(".file1").change(function(event){
var input = $(event.currentTarget);
var file1 = input[0].files[0];
var reader = new FileReader();
reader.onload = function(e){
image_base64 = e.target.result;
preview.append("<img src=\'"+image_base64+"\' width=\'139\' height=\'108\'/>");
};
reader.readAsDataURL(file1);
});
});
</script>

     

     

     

     

     

    Sperm Gibi Adamlar Var İnsan Olma İhtimalleri Milyonda Bir
    Reply With Quote Alıntı yap
  2. KısayolKısayol reportŞikayet pmÖzel Mesaj
    Hybris
    Hybris's avatar
    Kayıt Tarihi: 12/Haziran/2007
    Erkek

    var preview = $(".upload1-preview");

    var preview = $(".image");

    ile değiştir. ya da

    preview.append

    preview.children().html

    değiştir. muhtemelen çalışır ikisi de.

    edit: ilki çalışmaz.

    Hybris tarafından 20/Kas/14 15:01 tarihinde düzenlenmiştir
    agile isn’t how fast you can go, it’s how fast you can turn.
    Reply With Quote Alıntı yap
  3. KısayolKısayol reportŞikayet pmÖzel Mesaj
    TheMayk
    TheMayk's avatar
    Kayıt Tarihi: 18/Mart/2013
    Erkek

    Teşekkürler, çalıştı.

    Sperm Gibi Adamlar Var İnsan Olma İhtimalleri Milyonda Bir
    Reply With Quote Alıntı yap
  4. KısayolKısayol reportŞikayet pmÖzel Mesaj
    trnight
    trnight's avatar
    Kayıt Tarihi: 21/Ocak/2013
    Erkek

    Hocam halletmişsinde belki attr metoduyla src sini değiştirerek de yapa bilirsin.Anlık olarak sayfaya yansırmı bilmiyorum ama src ala biliyorsun ve değiştire biliyorsun.

    Bilgi güçtür...
    Reply With Quote Alıntı yap
Toplam Hit: 920 Toplam Mesaj: 4