В этой части главы мы будем использовать для выбора файлов тег <input>, однако вы всегда можете воспользоваться знаниями, полученными в главе 8, и интегрировать представленные далее примеры кода с функциональностью API Drag and Drop (Перетаскивание) (листинг 12.1).
Листинг 12.1. Шаблон для работы с файлами пользователя
<!DOCTYPE html>
<html lang="ru">
<head>
<link rel="stylesheet" href="file. css">
<script src="file. js"></script>
</head>
<body>
<section id="formbox">
<form name="form">
<p>Файл:<br><input type="file" name="myfiles"
Id="myfiles"></p>
</form>
</section>
<section id="databox">
Файл не выбран </section>
</body>
</html>
CSS-файл включает в себя стили для этого шаблона и других шаблонов,
С которыми мы будем работать позже (листинг 12.2).
Листинг 12.2. Стили для формы и поля данных
#formbox{ float: left; padding: 20px; border: 1px solid #999999;
}
#databox{ float: left; width: 500px; margin-left: 20px; padding: 20px; border: 1px solid #999999;
}
.directory{ color: #0000FF; font-weight: bold; cursor: pointer;
}
Добавить комментарий