падащи Drag сваляния

Добре дошли! В този урок ще ви покажа как да асинхронно качвате файлове на сървъра, в този случай, така че изборът на файла може да направи, като го плъзнете към определена област на страницата. Такива асинхронен сваляне на файлове се нарича Drag сваляния капка и е много интересно решение, което е било използвано на много сайтове. Е, ако все още имате нужда от редовен изтегляне, можете да мислите за урок на качване на снимки на PHP сървър.

Да започнем с това, разбира се, трябва да създадете точка, която ще "хване" файла. Освен това, ние поставяме в маркера за педя-елемент за показване на състоянието на изтегляне и входни съобщения от вида на файла. не се ограничава изборът на даден файл само с плъзгане и пускане, както и позволява на потребителите да изберете файл, като кликнете върху определения район. Видът на края на тази структура е представена по-долу.

CSS за този HTML код незабележително, с изключение на област декорация вход:

Просто опишете два класа, които когато се добави към областта на "улавят" файлът ще сигнализира за успешно изтегляне на файл или на едно и също, в случай на такава грешка:

Сега можем да преминем към писането на "действието" на нашата страница. Да започнем с това, ние пишат на извикванията на променливи към обекти, към които ние се достатъчно често, моля, свържете се с:

След това, ние се отървете от събитията по подразбиране са в контакт с курсора в нашата област да получи файл, както следва:

На следващо място, възлага събития селекция манипулатор файл, като например отпадане, както и изборът чрез въвеждане на поле:

И в двата случая, събитието завърши с функция за повикване sendFile. който се предава от потребителя файл.

Тази функция е отговорен за трансфера на файловия сървър. описанието му може да се види по-долу.

Както можете да видите, преди изпращане на данни към сървъра е променил две събития, първото от които е отговорен за показване на напредъка на изтегляне, а втората за уведомяване за изтеглянето. Те работят както следва:

Последният етап ще бъде обработката на сървъра на данни:

На този писането на асинхронния скрипт зарежда тетера плъзгане завършена. Благодаря ви за вниманието!