Содержимое извне приложения не имеет доступа к объектам File, получаемым при перетаскивании файлов в приложение AIR. Нельзя и передать один из этих объектов File содержимому приложения через мост изолированной программной среды. (В процессе сериализации доступ к свойствам объекта должен быть открыт.) Тем не менее файлы по-прежнему можно перетащить в приложение путем прослушивания событий nativeDragDrop в AIR на объекте HTMLLoader.
Обычно, если пользователь перетаскивает файл во фрейм с содержимым, не относящимся к приложению, событие drop не переносится с дочернего элемента на родительский. Однако, так как события, отправляемые HTMLLoader (который является контейнером для всего HTML-содержимого в приложении AIR), не являются частью потока событий HTML, событие drop по-прежнему можно получать в содержимом приложения.
Для получения события отпускания файла родительский документ добавляет прослушиватель события к объекту HTMLLoader, используя ссылку
window.htmlLoader
:
window.htmlLoader.addEventListener("nativeDragDrop",function(event){
var filelist = event.clipboard.getData(air.ClipboardFormats.FILE_LIST_FORMAT);
air.trace(filelist[0].url);
});
В примере ниже используется родительский документ, загружающий дочернюю страницу в удаленную изолированную программную среду (http://localhost/). Родительский документ прослушивает объект HTMLLoader на предмет события
nativeDragDrop
и получает URL-адрес файла.
<html>
<head>
<title>Drag-and-drop in a remote sandbox</title>
<script language="javascript" type="text/javascript" src="AIRAliases.js"></script>
<script language="javascript">
window.htmlLoader.addEventListener("nativeDragDrop",function(event){
var filelist = event.clipboard.getData(air.ClipboardFormats.FILE_LIST_FORMAT);
air.trace(filelist[0].url);
});
</script>
</head>
<body>
<iframe src="child.html"
sandboxRoot="http://localhost/"
documentRoot="app:/"
frameBorder="0" width="100%" height="100%">
</iframe>
</body>
</html>
Дочерний документ должен представлять действительный целевой элемент перетаскивания путем вызова метода
preventDefault()
объекта Event в обработчиках событий HTML
dragenter
и
dragover
. В противном случае событие перетаскивания может никогда не произойти.
<html>
<head>
<title>Drag and drop target</title>
<script language="javascript" type="text/javascript">
function preventDefault(event){
event.preventDefault();
}
</script>
</head>
<body ondragenter="preventDefault(event)" ondragover="preventDefault(event)">
<div>
<h1>Drop Files Here</h1>
</div>
</body>
</html>