19 EYLÜL 2013, PERŞEMBE

Dosya Karşıya Yükleme İlerleme Çubuğu Metre Öğretici Html5 Ajax Php

Bu eğitimde nasıl html5 kullanılacağını gösteren olacak PHP JavaScript zarif işlemek için Dosya yükleme nedeniyle biz kullanıyoruz gerçeği html5 şimdi ilerleme çubukları Eski sürümlerde bir tarayıcı amaçlanan bu uygulamanın işe yaramayabilir yazılım yani şimdi sadece ya Google Chrome'da deneme emin olun için Bunların Firefox veya Internet Explorer en modern versiyonları küçük script her satırı kodlama olacak bu yüzden herhangi gerek orada olacağım hantal üçüncü taraf kod kütüphaneleri çerçeveler vardır Bu biz uygulama özünde nasıl çalıştığını daha iyi bir anlayış olacak çok yönetmek için çok daha kola

y olacak yolda özelleştirmek İlk üyenin derse bitiş ürünü bir göz atalım Eğer uygulamalar yarar olabilir olup olmadığını değerlendirmek bakın olan dosya yükleme ilerleme metre bu küçük demo dan şimdi ben ne yapacağım için şu

anda çevrimiçi benim sunucu canlı çalışıyor ise Bir video dosyası için bilgisayarımı göz ve emin olun, en azından bir megabayt bitti biri bazı ilerleme çubuğu içine yüklenmesi ve yüklemez görebilirsiniz yol

“Ders Kodu: http://www.developphp.com/video/JavaScript/File-Upload-Progress-Bar-Meter-Tutorial-Ajax-PHP Bu programlama dersimizde size dosya yükleme formları zarif...”
Adam Khoury

u yani süper hızlı bu yüzden benim bilgisayar getirdi ve ben tom ve jerry bir video dosyası dat mp4 seçti benim masaüstünde oturuyordu ve yaklaşık 2.8 megabayt şimdi basın var dosya upload ve ben yaptım oldu iki satır burada sadece geliştirici amaçlı altına eklenir Bu ilk satır size kesin sayısını gösterir yüzde şimdiye kadar sunucuya yüklenir ne kadar dosya seviyorum ve bu bar güzel yeşil çubuk burada Çok dibine şimdi de tam yüzdelerini göstermektedir Be

Dosya Karşıya Yükleme İlerleme Çubuğu Metre Öğretici Html5 Ajax Php Resim 1 Dosya Karşıya Yükleme İlerleme Çubuğu Metre Öğretici Html5 Ajax Php Resim 2 Dosya Karşıya Yükleme İlerleme Çubuğu Metre Öğretici Html5 Ajax Php Resim 3 Dosya Karşıya Yükleme İlerleme Çubuğu Metre Öğretici Html5 Ajax Php Resim 4

n ne kadar dosyayı gösterir ekstra bir çizgi koymak ısırıkları dosya boyutu toplam bayt ve yüklenen adres: geliştirici şekilde Dosya yüklü olan ne kadar görebilirsiniz Tam olarak kaç bayt ve toplam bayt miktarı Yükleme tamamlandığında biz uygulama render var Bu dosya aslında ajax isteği geri geliyor bir mesaj Burada bu mesajda Ajax kullanarak yükleniyor PHP sanatı bir yankı çıplak kemikleri bir HTML5 var olan başlayalım olduğunu web belgesi hepimizin bu uygulamanın üretime görebilirsiniz Bu yolu çizik

Mayın html5 dosya yükleme formu adlandırılır bağlı HTML Eğer bunu dosya istersen bu dosyayı adlandırabilir sadece formu evler bu yüzden ilk en biz gereken tüm HTML koyacağız gövde elemanının içine gidelim yer ve sonra kontör script öğesindeki burada JavaScript takacağım Vücutta ilk şey ben h2 başlığı eklenmiş, güvenlik danışma O html5 Dosya yükleme ilerleme çubuğu öğretici diyor o altında ben aşağı gitmek emin olun benim form elemanını açmak için gidiyorum hatların çift o biçim öğesi içine artık form öğesi açılış etiketinin içine yapacağız koymak değil Vermek ideal Bu formda ve kimlik değil bu noktada çok önemli olduğunu ve aslında biz bile gitmiyoruz bütün uygulama içinde bu kimliği başvuru ancak biçim bir isim gerekebilir ve bir kimlik böylece devam edebilir ve bu verileri daha sonra vermek niteliklerini kodlama biz multipart / form-data olacak bulunmuyor yani kodlama türü multipart / form-data olacak Biz dosya yükleme uygulaması ve ardından yöntemi yapıyolar çünkü Form kullanacağı post biz de yöntem direkten belirtmek için gidiyoruz Ben isteği ajax içinde gerçekten ajax yükleyerek ne olacak, çünkü dosya ve sonrası ajax isteği için belirtilen olacak tamam şimdi eski sereceğim içindeki türü ile giriş elemanı olmuştur Dosyayı seviyorum ve bu size kullanıcı veren şeydir Dosya düğmesi için küçük göz hangi tarayıcıyı bilgisayara izin verir ve dosyayı seçin Dosya1 gibi basit bir şey olduğu eşit, bu bir name niteliği verecek daha da kimlik verilen aynı değerde niteliklerini Giriş elemanı olarak kapanacak ve biz sadece bir fren etiketi koyacağım onların Bu şekilde biz şimdi bir sonraki sayfada bir çizgi mola İstediğimiz giriş elemanı tipi sevgi olacak düğmesi de biz metin ne olduğunu belirttiğiniz şekilde öznitelik değer vermek düğme hamle biz bu butona ihtiyaç yükleme dosyası artık son şey söyletme tıklama üzerinde çok koymak click olayı dinleyicisi değil biz bir yangın kazandı ne olursa olsun javascript fonksiyonu eşit yani yazacak javascript fonksiyonuna adı olacaktır Açık yakın Parantez daha dosya upload Bu bizim Dosya Yükle fonksiyonunu çalıştırmak nasıl olduğunu Bu butona tıklama bu ilk giriş kullanıcı bizim bilgisayar göz atmanızı sağlar ve dosyayı seçin ve daha sonra bu girdi dosyası yükleme başlatan bir düğme basitçe ve ben olurdu bu hepsi çok temel beyler programlama ediyorum tam olarak istediğiniz şekilde çalışma almak için tüm uygulama özelleştirmek Ben sadece gösteri amaçlı bir çok temel yapıyorum şimdi yapacağız yeni html5 ilerleme öğe eklemek ediyoruz Açılış etiketi ve bir kendi ilerleme kapanış etiketi koymak şimdi ilerleme çubuğu seviyorum kimliği bu vereceğim Başlangıç ​​değeri 0 yapmak ve maksimum niteliği yapacak O 0'dan 100'e kadar bir dizi var yol 100 ve ben öylece havada bir stil niteliği ile bir hale koymak ediyorum ne gördüm istiyorum bununla özelleştirmek İlerleme çubuğu 300 piksel işletmek siz de yapabilirsiniz Bu ilerleme elemanı için diğer bazı stil özellikleri hedef ve yaptığımız sonraki şey vardı bu iki hattınız olduğunu demo uygulaması olarak çubuğunun altında Bize tam sayısını gösteren küçük bir çizgi oldu Biraz yüzde sembolü ile yüklenir ne kadar ilerleme ve daha sonra birçok ısırıkları yüklenen nasıl bize gösterdi hattı oldu ve kaç toplam bayt veya dosya boyutu için h3 başlığı bu pop ilki yerine gider değil ve biz bir kimlikle bir paragraf öğesi sonra durumu bir fikri vardır Yüklenen ve toplam durum biz gerçek yüzdesini koymak için gidiyoruz nerede numara Dediğim gibi ne kadar yüklenir geliştirme amaçlı bir olduğunu istediğin için son uygulamada varsa ancak son kullanıcılar görmek için Bunu yapmak seçebilirsiniz ancak onları istemiyorsanız sadece bu kaldırabilirsiniz İhtiyacınız gerçekten onları göstermek için ilerleme çubuğu, çünkü ne kadar yüklenmiş gibi ama bazı insanlar onları numarasını gösteriyor yanı sıra küçük bir yüzde sembolü ile böylece tüm HTML bizim uygulama var Şimdilik gerektirir Şimdi biz bir de olacak pop kulüpler birinci JavaScript kısmı üzerinde çalışabilirsiniz işlev bu sadece bana kullanmak için izin gidiyor Benim uygulamada eleman kötü numarası a whole lotta kez olsun belge Ben kullanmak istemiyorum çünkü hepsi defalarca tekrar tekrar ben sadece yazabilirim Bu döndüren bir fonksiyon küçük tüm altını değil kullanmak zorunda sayfadaki fikirle herhangi bir unsur olsun Burada bir dolar işareti kullanacak önce hiç jQuery kullanmak ettik Şimdi yapmanız gereken tüm dolar işareti konur uygulamalarınızda yol ve sonra ben sıska olduğumu istiyorum elemana bakın bir çizgi olduğunu yol kimse karıştı gets böylece tüm bu fonksiyon unsur olsun belgeyi iade etmek kurulur mu Kimlik ne olursa olsun öğe için nesne başvurusu sayfada hedefliyorsanız sadece yazı belgesini önlemek için bir yol olduğunu uygulamanızda eleman şalvar birçok birçok kez olsun Şimdi biz JavaScript gereken bir sonraki şey, bu yükleme dosyası işlevi böylece atalım olduğunu bir olacak ateşi olduğunu işlevi bu ismi kopyalayın Bu Dosya Yükle düğmesine tıklayarak olay Biz Bana yazdığınız fonksiyonu JavaScript girdi Yükleme dosyası kapa parantez koymak Open Bir kapatma küme ayracı satır bir çift kaşlı ayraç kodu açılması ve koyun ve biz gereken ilk şey yükleme dosyası işlevinde yapmak yüklenmesine dosyayı hedef olduğunu Böylece biz daha adil adlandırın bir değişken adı olacak ihtiyacımız var Daha fazla dosyaya bu değişken eşit hale Ge ve id1 hedef belge doc olsun elemanı burada dosya1 edilir Daha fazla erişim daha kendi dosyaları dizisi ve dosyalarda ilk eleman olduğu bir Biz köşeli parantez arasına 0 koyarak bu erişebilirsiniz onun kimliği ile dosya alanını hedeflenen ve daha sonra onun dosyalar vardır erişmek dosyalarında ilk eleman temelde size verdiği bir vardır kişi için göz ne olursa olsun dosya için nesne başvurusu ve sonra şimdi bu sonraki satıra yüklenen ve ben bir yerde var olacak dışarı yorumladı ama sen bu uygulamayı çalıştırmak yorumladı ilk birkaç kez isteyebilirsin bu yüzden size dosya adına erişim nasıl görebilirsiniz dosya boyutu: ve hatta kullanıcı önce dosya türü yükleme presler düğme böylece javascript Yan uygulamanızda Bu dosya yükleme için PHP gönderilmeden önce dosyaların adını erişimi boyutu ve türü Eğer forma için bu şeyleri değerlendirmek gerekir ve eğer ben sadece bırakacağım Bunu açıklama Siz yorumladı üzerinde istiyorum ve ilk birkaç kez çalışmasına izin olabilir sen uygulamayı çalıştırmak bu kadar iyi geliştirici amaçlı sadece orada ve bir sonraki değişken ihtiyacınız olacak Bir form verileri değişken böylece biz sadece aptly bunun adı olacak olan form verileri ve yeni eşit olacak form verileri nesne örneği daha bir hafta var bir şey kuruldu Kolayca göndermek anahtar / değer çiftleri ajax isteği verileri var ayrıştırma dosyasına bu yüzden bir sonraki satırda artık nesne başvurusu alacağım Ben Ekleme nokta ekleme yöntemini çalıştırmak için gidiyorum ve adı bu yüzden bir anahtar / değer çifti ekler anahtar dosyası biri olacak ve değeri bu yüzden bir sonraki parametre olacak virgül koymak ve o zaman biz sadece burada dosya nesne başvurusu sevk ve bu form verilerini örnek olacak gönderilecek olan ajax isteği biz gönderme yöntemini kullandığınızda bu yüzden şimdi en ajax isteği bizim Ajax kurtaracak oluşsun Yeni XML eşit HTTP açık kapa parantez noktalı talep şimdi bu uygulamanın bütün mesele var olduğu Bir dosya yükleme ilerleme çubuğu bazı olmak zorunda olduğunda olay dinleyicileri bu Ajax örneğine eklenir Biz istiyorum ilerleme olayı dinlemek istiyorum çünkü tam dinleyin olay bitince de hiç olay ve iptal olayı dinlemek bulacağız Şu anda bu satırları ve yeri pop böylece biz götürüyoruz görebilirsiniz Ajax nesnesi örneği ve ne için olay dinleyicileri ekleyerek ilk etkinliği kaçırmayın dinleyici ilerleme İkincisi ise yük olduğunu ve komple olay böylece bütün işlemin dosyasında tamamlandığında Yüklenen ve PHP bir yanıt geri verir ediliyor bitmiş olan Bu load olayı genellikle tamamen ve fonksiyon patlar işte o zaman Bu yükleme için ilerleme olay sırasında yürüteceğini Bir ilerleme işleyicisi işlevi çağrılacak gidiyor Yeni bir ilerleme yükleme var ki her zaman Sunucuya yüzden her zaman daha fazla sokması sunucuya ilerleme yüklenir olay yakında çalıştırmak için çağırdı ya da ilerleme işleyici işlevi edilecek olacak ilerleme olay dinleyicisi tarafından çalıştırmak için çağrılacak olan Şimdi bu son iki Hiç bir nadiren hiç ne olacak iptal ve dikkat çekmek için hazır yerde fonksiyonlara sahip olacak ne yaparsanız bu olay olay dinleyicileri ekleyerek bunların nasıl yalındır hepsi Ajax örneğine biz sadece olayı hedef O zaman dinlemek istediğiniz biz istediğimiz fonksiyonun adını koymak ateşlemesi bu olay böylece ortaya çıktığında biz bu işlevleri yazdım zorunda Bizim komut ben sadece bir saniye içinde yapacağımız bunu dört işlevi alacağım ilerleme ve onların tam işleyicisi hata işleyicisi ve işleyicisi iptal Bu dört işlevi yazarken bu olaylar onları gerçekleşecek oldu Bu fonksiyonlar bu olayların dikkat çekmek için gidiyoruz Şimdi fark edeceksiniz ilki progress olayı olduğunu Biz olay dinleyicisi eklemeden önce yükleme nesne başvurusu var ve bu kadar ederken yüklenme ilerlemesini izleyebilirsiniz sadece böylece var uploading biz koydu nokta yükleme başvurusunu kaldırın eğer onların Eğer uygulama benim kadar işlevi doğru yüzden biz koymak olduğunu fark edeceksiniz emin olmak için, sadece yer Biz yüklenme ilerlemeyi değerlendirmek olduğunu o yüklenirken esnada ben için gereken çok sonraki şey açmak ajax isteği açık yöntem şimdi açık yöntemini çalıştırmak için iki parametre İlk parametre olacak sonrası ve ardından bir sonraki parametre mesajı sadece URL Bir maden dosya yükleme bir ayrıştırma dosyası ayrıştırıcı PHP dosyası olacak o olduğunu Aslında sunucusuna yüklenen dosya taşımak ve sana bir an bu dosyayı ve ihtiyacımız çok son satırı göstereceğiz Bu içinde Yükleme dosyası işlevi Ajax noktalar ve yöntem Bu aslında bütün ajax isteği hücresini çalıştırır ne biz koymak yapmak zorunda bu yüzden form verilerini göndermek edeceksin Zaten dosyayı sahiptir bizim form veri örneği nesne Burada buna eklenir dosya PHP tarafından yüklenen olabilir bu şekilde şimdi biz o PHP bakmak önce ayrıştırma dosya upload biz konuşurken yerinde bu dört küçük işlevleri ihtiyacımız olacak yaklaşık ve ilerleme ve bu egzersiz nedeniyle en önemli olanı var Buna gidiyor biri Her zaman sunucusunun ateş tutmak Yeni yüklenen ısırıkları ile güncellenir Ben muktedir değilim Olay toplam nokta bir olay yüklenen var erişmek Şimdiye kadar yüklenen kaç bayt olacak toplam byte ve biz bu iki numara hesaplayabiliriz Kendimize bir yüzde vermek için tamam ilk bu alalım yerine yazılı fonksiyon ilerleme işleyicisi o yüzden koyalım Fonksiyon ilerleme işleyicisi yakın parantez açmak Bu olaylar ateş zaman şimdi küme ayracı kapatma küme ayracı açılış Biz olay referansı kapmak istiyorum Bu fonksiyonda argümanlar alan argüman için çok bazen bu görebilirsiniz şimdi koymak olayı yapacağız bu fonksiyon için yazılı VT gibi bazen sadece olarak görebilirsiniz Bir olabilir Neyse önemli değil E istediğin yazmak Eğer sürece bile fark etmez istiyorum ama eğer onlar bu olabilir sen bu kadar ne çünkü ben sadece alacağım bu olay başvuran olay yazmak olduğunu Akılda tutulması gereken bu evet olarak yazılır görebilirsiniz olduğunu ve biz sadece E yazmak için kullanılan bir ActionScript hatırlıyorum Eğer onun gibi görmek ister böylece olaylar hatırlıyorum başvuru Bir / c üzerinde evet olarak görüyorum tamamen olayı olarak yazılır Olay referansı karıştırıyordu hangi daha sonra her iki şekilde çalışacağız şekilde biz olayı erişebilirsiniz bu işleve argüman olarak Onların işlevi söylüyorlar içinde işlev içinde şimdi ilk o zaman yapacağız belge elemanı kimliği almak ve yapacağız hedef bu olduğunu alt dışarı dolu ve toplam eleman Bu hat öylece geliştirici amaçlı olacak bu bir adil göstermek için ne kadar dosyanın şimdiye kadar ve ne kadar toplam bayt yüklenen etti böylece yüklü byte ve toplam bayt alırsınız Bu paragraf elemanı size gösterilen ama sen bitmiş uygulama için eğer ihtiyacınız varsa o kaldırabilirsiniz çok tatlı paragraf elemanı onun hedef olacağını savundu Yapacağımız innerHTML özelliği eşit olun I love dize yüklediğiniz ısırıkları toplam byte kaç yüklü ısırıkları görebilmeniz ilerledi ve toplam kaç tarafından sahip olan biz de toplam bir etkinlik yüklü olayını kullanmak için gidiyoruz var türünün çok doğru şimdi yüzde almak için Yüzde olay nokta eşittir Olay nokta bölü yüklenir.İşte Ben çarpma olduğunu 100 tarafından edeceğim toplam Bu şekilde biz ondalık değer alamadım ve biz bunu doğru yüzde numarasını almak Bunun için aradılar sadece temelde bir yüz ile çarpılması ederim ki yapmak emin hiçbir ondalık basamak temelde üzerinden ondalık ilerliyorlardı olduğunu Şimdi biz KODU elemanı olsun o belgeyi söyleyebiliriz Bu ilerleme çubuğu yeni html5 ilerleme çubuğu ve onun nokta değerine eşit hale yüzde ve bu sayı her zamankinden ondalık olmak olur Sadece koyabilirsiniz yuvarlak matematik nokta istiyorum Yuvarlak yöntemle nokta matematik yüzde numarasına çalıştırmak için Ben olsun belge elemanı sayfasındaki durum elemanını sarkık diyecekler Bu hangi Burada küçük h3 elemanı yapacağız gerçek koyacağız Yüzde numarası ve kullanıcı görebilirsiniz böylece yüzde sembolü dot innerHTML eşit olduğunu söylemek ve biz sadece burada bu aynı numarayı yüzde alacağım artı yüzde sembolü yukarıdaki dize ve sözler yükledi dot dot dot lütfen bekleyin ve biz gidiyoruz tüm kod içinde ihtiyaç olduğunu bizim İlerleme işleyicisi işlevi böylece bu fonksiyonlar bir sürü olacak ateşi Bu size üstündeki çubuğu etkileyen Animasyon verir ne bkz en bu bütün fonksiyon basın Kontrolü alalım, böylece büyüyen bu bir basın kontrol altına inmek v Biz tam fonksiyon var ve bu yüzden işleyicisi tamamlamak için bir hareket değiştirildi Şimdi işleyicisi biz de tutmak istiyorum alttan tek satır bu satırı kaldırabilirsiniz onların biz yapmak istiyorum ilerleme çubuğu değeri Yüklemeden sonra 0, bu tam ve işlevi artık tamamlandı ne zaman PHP işlevi olduğu yangınlar olduğunu yükleme geri yankıları ajax isteği tamamlandı PHP geri yankıları nedenle zaman yükleme tamamlandığında PHP bazı tür geri yankıları ajax isteği ya da Hiç olay bu komple ve ayrıca yapmadan önce o bulacaktır ilerleme Bar değeri geri 20 istiyorum statüsünde bir şey koymak İç HTML ve gerçek metin geri geliyor php dosyasından geri yankılandı ve mesafesindedir nokta yanıt metnini hedef Bunu biliyor Ajax ile herhangi bir izleyici tanıdık çalışma var Metin özelliği aldığımız nasıl nokta yanıtını hedef Bir ayrıştırma geri tepki metni bir PHP komut dosyası dosya ve hepsi orada eksiksiz ve işlev yapacağı yani tam işleyicisi yük durumunda yük olay bağlıdır İşlem sadece oldukça fazla araç olduğunda operasyon Tamamen Hiç bir durdurma şimdi tamamlandı çok temel olacak işlevler burada hata işleyicisi alır Bu 1 için ben sadece sağ durum elemanına gidiyorum Yükleme olsun o işlevi alıp gidiyor başarısız işleyicisi iptal bir iptal gibi olmak değil Onlar abort çalışmıyor, dosya yükleme iptal edilirse için dinleyici işleyicisi ve durum yükleme iptal koymak olacak şimdi bizim olay dinleyici işlevlerinin dört var yerinde ve şimdi JavaScript biz yapmak için gereken her şeyi var yazmak veya dosya yükleme PHP parsellere basitçe hamle yüklenen dosya yüklenen komut olacak olan Sunucu ve daha sonra mümkün bu ajax isteği geri echo mesajın çeşit Dosya yükleme çözümleyici gördüğünüz gibi tamam Bu gösteri için çok temel yapılır ve isteyeyim daha fazla genişletilmiş hata işleme ve bir dosya boyutu türünü kontrol ve emin orada ve benzeri şeyler yapmak sadece şimdiye kadar koymak taşıma Dosya olsaydı yer kontrol ve görmek oldu Sadece biz önce olup olmadığını görmek için bunun için göz Bir üzerinde hareket yüklenen dosya işlevi çalıştırmak aslında biz istedik koymak Sunucu bu yüzden bu script yapmak ilk şey biz temsil bazı değişkenleri istiyorsun Dosyanın adı PHP temp klasöründe onun geçici konumu onun kendi boyutunu yazın ve eğer gördüklerinizi bu dosya upload hata iletileri Biz belirterek tüm bu küçük şeyler erişin Küresel dosyaları değişken anahtar Gelen anahtar / değer çiftleri adıyla ve biz anahtar değeri çifti Kia dosya1 olarak gönderiyorlardı ve sonra dosyayı bir yüklenecek ve biz içine dokunabilirsiniz o onun dizi öğelerini belirterek bu dosya hakkında çok az özel ayrıntılar Bu komut dosyası içine geliyor dosya arkasında verilerin bir dizi vardır, çünkü biz küçük parçalar erişebilmesini Hata boyutu tipi Tampa adı örneğin ve ben yapacağım ilk şey dosya PHP olup olmadığını görmek için kontrol edin isim Hazır terim taşınacak Orada değilse ben de geri echo kulüpler ajax isteği hiç yükleme düğmesini tıklamadan önce dosyaya göz atın lütfen Dosya PHP Temp klasöründe ise ve biz senaryoyu çıkmak ve biz sadece hareket yüklenen dosya işlevi çalıştırmak daha olmaya hazır olduğunu Hareket Yüklenen dosya işlevi düzgün yürütür eğer öyleyse ben yaptım tüm ı koymak oldu Ben ajax isteği dosya adına geri echo şeyler: yükleme nedeniyle bu nokta her şeyi başarılı olarak tamamlandığında Başka bir hareket Yüklenen dosya işlevi düzgün çalışmadığı durumlarda Seni başarısız ajax isteği taşımak yüklenen dosya fonksiyonuna geri echo şişirilmiş bir dava işlevi işliyor hareket iki kişi gerekir nasıl siz biliyor ilk parametreyi parametreleri o ikamet nerede dosya yüklenmesine olan PHP temp klasöründe bu ikinci hareket alır geçici önce parametre Hedefiniz var istiyorum yolu ve adı Bu dosya için sizin gibi hissediyorum eğer istersen dosya adı olabilir adını değiştirerek ya da sadece o kadar şişirilmiş bir olduğunu özgün adını tutabilir Burada ne yapıyoruz ya da bunu değiştirebilirsiniz hangi ve ayrıca dizinde herhangi bir klasörü hedef olabilir klasör sisteminde web sitenizde sadece hedefleme ediyorum Bu klasörde test dışarı yükleri adında bir klasör Sevdiğim dosya yerine ben belki burada işleme daha fazla hata koymak istiyorum söyledi dosya boyutunu kontrol ediyor: onun tipi ve gösteri için komut yapılmış olduğunu temel Just Like şeyler amaçları böylece dosya yükleme çözümleyici için var ve çok basit Şimdi geri Ağustos yük formunda ben kullanmak zorunda değilsiniz siz çocuklar için stres istiyorum ilerleme, yeni html5 ilerleme çubuğu öğesi herhangi bir grafik için istediğiniz herhangi bir özel grafik animasyon örneği yerine burada bir kampüs öğesi istersen Kullanmak istediğiniz herhangi deli çizgiler çevreler ya da her türlü vardır bunu yapabilir ilerleme diğer dosya yükleme göstermek için Bir kampüs elemanları üzerinde animasyon var ki bu ilerleme sahip Burada element birçok kez göreceksiniz bu yüzden de bir div içinde yaptım koyabilirsiniz insanlar geleneksel ilerleme çubukları meşguldür yapmak için kullanılan onlar sadece ebeveyn yapmak a div içinde yaptım kullanarak vermek bir bir sınır var Bir put in arka Biraz içeride iç div ve iç fırsatları ile Olay bu nedenle bu ilerleme elinde JavaScript aracılığıyla etkilenir Bu ilerleme ve olay içinde sadece bir ile verir hedef olabilir ve yüzde numarasına göre büyümeye yapmak böylece iç gibi olacağını did ebeveyn gülüm ver gülüm içeriden yetişen büyüyen renkli çubuk ve ebeveyn sadece her yerde görünmesi oa sınır arka plan verdin İstediğiniz Bir çocuk var içeriden sahip oldukları dinamik büyür FileUpload yüzde göre çok sayıda var farklı şekillerde, bu yaratıcı olabilir ve sadece kullanmak istedim Bu tam olarak ne çünkü yeni html5 ilerleme elemanı ilerleme Web'de kullanmak vardı yeni ve modern bir şey bunun için var tasarlanmış ve şeylerin tam olarak bu amaç için yapılmış Bunu kullanmak zorunda değilsiniz buna benzer ama akılda tutmak istediğiniz herhangi bir özel grafik kullanabilirsiniz tamam böylece nasıl html5 JavaScript ve PHP kullanılacağını gösterir Zarif dosya yükleme ilerleme metre işlemek için ve ihtiyacınız olan tüm programlama için bu şeyi özelleştirmek mümkün Gelecekteki uygulamalar Bu ders zevk umuyoruz ve bir an eğer gibi düğmeye tıklandığında olsun Beğendim Herhangi bir sorunuz veya yorumunuz varsa ve bu malzemenin ilgili Eğer güle güle video altında ki yazabilirsiniz.

Açıklama

Ders Kodu: http://www.developphp.com/video/JavaScript/File-Upload-Progress-Bar-Meter-Tutorial-Ajax-PHP Bu programlama dersimizde size dosya yükleme formları zarif bir dosya yükleme ilerleme çubuğu işlemek için HTML5 + JavaScript + PHP kullanmayı öğrenebilirsiniz. Bu kullanıcıların çok YouTube bir dosya yükleme ilerleme çubuğunu onların ağa video upload her zaman işler yolunda gibi, sunucuya dosya yüklemek ne zaman bir dosya yükleme ilerleme çubuğu işlemek için arzu edilir. Programlama başlayanlar anlamak için bile zor değildir ve script nispeten kısa olduğunu. Yeni HTML5 ilerleme unsuru bu gibi senaryolarda kullanmak geliştiriciler için özel olarak yapılmış, otomatik olarak görsel belirli tarayıcı yazılımı ile eşleşir, ancak tüm farklı tarayıcılarda markalaşma veya tutarlılık için yükleme çubuğu grafik özelleştirebilirsiniz. Tarayıcı yazılımı eski sürümlerinde amaçlandığı gibi nedeniyle yeni bir HTML5 elemanı kullanan aslında bu uygulama çalışmayabilir. Bu kod ile deney yaparken modern popüler tarayıcı yazılımı kullanın.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

Adam Khoury

Adam Khoury

Profesyonel bir online bedava gibi kod ve tasarım öğrenin. JavaScript, PHP, SQL, HTML, CSS, ActionScript ve daha fazlası gibi usta geliştirme teknolojileri. Tüm videoları http://www.developphp.com daha iyi organize olan

YORUMLAR



9.9/10

  • 732
    Olumlu
  • 5
    Olumsuz
  • 181
    Yorum
  • 63994
    Gösterim

SPONSOR VİDEO

Rastgele Yazarlar

  • 0TACTICAL0HIPPY0

    0TACTICAL0HI

    30 EYLÜL 2012
  • Jack Vale Films

    Jack Vale Fi

    8 ŞUBAT 2007
  • Rickymon Tero

    Rickymon Ter

    1 Ocak 2007

ANKET



Bu sayfa işinize yaradı mı?