Download Source Code Aplikasi

Tutorial Php : Cara Membuat Image Preview Sebelum Upload Dengan jQuery

Tuesday, December 3rd, 2019 - Tutorial Php

Resplandor sobat sourcecodeaplikasi, di postingan kali ini, kami akan share sebuah tips pada pemrograman php, tips ini lumayan menarik bagi dipelajari karena akan lumayan banyak diaplikasikan di fitur program dengan web, yaitu mengenai mengandung image preview sebelum upload gambar. Ilustrasinya kira-kira seperti di gambar di bawah ini.

Bikin Preview Image Tanpa Reload Dengan jQuery. kali ini saya akan share codingan sederhana namun powerfull yaitu Merancang preview image tanpa reload dengan jquery + js

Image preview yakni diantara fitur yang betul-betul dibutuhkan bagi mengecek kembali apakah gambar yang kita upload telah benar atau tak. Jadi di panduan kali ini saya akan membagikan cara membuatnya dengan jQuery, HTML dan CSS

TAHAP TAHAP

Bikin file HTML terlebih dahulu dan ketikkan kode dibawah  ini

Lalu bikin tuliskan script javascript di bawah tag </head> atau bikin file baru dengan nama preview_image.js

  • Perhatikan baris ke 6 jikalau ada file yang masuk karenanya akan menjalankan baris ke 7
  • Di baris ke 7 akan menampilkan image dengan id “blah” dan mengubah atribut dengan source yang telah diambil di baris ke 12-14
  • Di baris 12-14 jikalau ada perubahan di input file karenanya function readURL akan dijalankan
Di intinya function readURL akan mengambil address file dari inputan file
Tampilan komplit file HTML dan javascript nya

Ok, hingga sini dulu postingan kode sederhana nya, jikalau ada yang perlu ditanyakan silahkan dari kontak atau dari kolom komentar di postingan ini. Selamat mencoba dan semoga bermanfaat.

 

Demikian yang dapat kami share kepada sobat source code aplikasi pada kesempatan ini, semoga dapat bermanfaat dan bisa menjadi referensi pemrograman bagi anda. Jangan lupa like Fan Page kami, dan SUBSCRIBE Channel Youtube kami untuk dapatkan update source code aplikasi terbaru.

(Telah didownload 18 kali, 1x didownload hari ini)
Download Source Code Aplikasi
Tutorial Php : Cara Membuat Image Preview Sebelum Upload Dengan jQuery | admin | 4.5


Leave a Reply