HTML 5.1: 5. Взаимодействие с пользователем

5. Взаимодействие с пользователем

* * *

5.2. Инертные поддеревья

Узел (в частности элементы и текстовые узлы) может быть помечен как inert. Когда узел инертен, агент пользователя должен действовать, как-будто узел отсутствовал в целях обеспечения адресности взаимодействия с пользователем событий, может игнорировать узел в целях поиска текста с помощью пользовательского интерфейса (также известного как "найти на странице"), и может запретить пользователям выделение текста в этом узле. Web-браузеры должны позволить пользователю переопределить ограничения на поиск и выделение текста.

Рассмотрим, например, страницу, которая состоит всего из одного инертного абзаца, расположенного посередине body. Если пользователь перемещает свой указатель мыши в элементе body над инертным абзацем и нажимает на абзац, ни одно событие mouseover не будут осуществлено, помимо этого события mousemove и click будут произведены на элементе body, а не на абзаце.

Когда узел является инертным, он не может принимать фокус, и не может быть отключён при помощи команд.

Весь Document может быть помечен как заблокированное модальное диалоговое окно subject. В то время как Document является помеченным, каждый узел в Document, за исключением элемента subject и его потомков, должны быть отмечены как инертные. (Элементы за исключением этого абзаца могут быть дополнительно отмечены как инертные с помощью других средств; будучи частью модального диалога не "защищённого" узла от элементов отмеченных как инертные.)

Только один элемент за раз может пометить Document как заблокированное модальное диалоговое окно.

* * *

5.6. Редактирование

* * *

5.6.5. Проверка правописания и грамматики

Агенты пользователей могут поддерживать проверку орфографии и грамматики редактируемого текста в некоторых элементах формы (таких как значение textarea элементов) или в элементах с редактируемым узлом (например, с помощью contenteditable).

Для каждого элемента, агент пользователя должен установить действия по умолчанию при этом, либо в качестве этих действий выступают стандартные действия по умолчанию, либо действия установленные пользователем. Существует три возможных варианта действий по умолчанию для каждого элемента:

true-by-default: Текстовая составляющая элемента будет проверена на орфографию и грамматику, если его содержимое доступно для редактирования.
false-by-default: Текстовая составляющая элемента никогда не будет проверяться на орфографию и грамматику.
inherit-by-default: Элемент должен унаследовать действие по умолчанию от своего родительского элемента. Элементы, которые не имеют родительского элемента, не могут принимать данное действие по умолчанию.

Атрибут spellcheck является перечисляемым атрибутом, значениями которого могут выступать – пустая строка, true и false. Пустая строка и ключевое слово true указывают на истинное состояние. Ключевое слово false указывают на ложное состояние. Кроме того, существует ещё и третье состояние - состояние по умолчанию, которое представляет собой недостающее значение по умолчанию (и недопустимое значение по умолчанию).

Истинное состояние указывает на необходимость проверки текстовой части элемента на орфографию и грамматику. Состояние по умолчанию означает, что действия над текстовой составляющей элемента будут осуществляться в соответствии с действием по умолчанию, возможно, перенимаемого от значения spellcheck родительского элемента как действие по умолчанию. Ложное состояние означает, что текстовую часть элемента проверять на орфографию и грамматику не нужно.

element . spellcheck [ = значение ]

Возвращает true, если текстовая составляющая элемента поверяется на орфографию и грамматику; в противном случае возвращает false.

Может быть установлен, чтобы переопределить значение по умолчанию и задать значение атрибуту spellcheck.

element . forceSpellCheck()

Заставляет агента пользователя сообщать орфографические и грамматические ошибки в элементе (если проверка включена), даже если пользователь никогда не придавал фокус элементу. (Если метод не вызывается, агенты пользователей могут скрыть ошибки в тексте, который не был введён пользователем.)

IDL атрибут spellcheck должен вернуть true в случаях, если spellcheck атрибут элемента содержит истинное значение, или если атрибут spellcheck указывает на состояние по умолчанию и стандартным действием для элемента является true-by-default или если атрибут spellcheck указывает на состояние по умолчанию и стандартным действием для элемента является inherit-by-default наследуемое от родительского элемента, который при запросе IDL атрибута spellcheck возвращает true; в противном случае, если ни одно из этих условий не верно, то атрибут должен вернуть false.

IDL атрибут spellcheck не зависит от предпочтений пользователя, переопределяющих значение атрибута spellcheck и, следовательно, может не отражать фактическое состояние проверки орфографии.

При установке, если новое значение истинно, то в качестве значения атрибута spellcheck должна быть установлена строка "true", в противном случае должна быть установлена строка "false".

Агенты пользователей должны рассматривать только следующие фрагменты текста являющиеся целью для этой функции:

Значение input элементов имеющих атрибут type со значением Text, Search, URL или E-mail и изменяемые (т.е. которые не имеют атрибут readonly и disabled).
Значение textarea элементов которые не имеют атрибут readonly и disabled.
Текст в Текстовых узлах, являющихся дочерними элементами редактируемых узлов или редактируемых элементов.
Текст в атрибутах редактируемых элементов.

Для работы с текстом являющимся частью Текстового узла элемента, с которым текст связан и является элементом, который выступает непосредственным родителем первого символа слова, предложения или другого куска текста. Для текста в атрибутах, являющихся атрибутами элементов. Для значений input и textarea элементов, это сами элементы.

Чтобы определить, является ли слово, предложение, или другой кусок текста в соответствующем элементе (как определено выше) проверяемым на правописание и грамматику web-браузер должен использовать следующий алгоритм:

Если пользователь отключил проверку для данного текста, то проверка не выполняется.
В противном случае, если пользователь включил проверку для данного текста, чтобы она была всегда включена, то проверка будет выполняться.
В противном случае, если элемент с которым связан текст имеет атрибут spellcheck, то: если этот атрибут находится в истинном состоянии, то проверка выполняется; если это атрибут находится в ложном состоянии, то проверка не выполняется.
В противном случае, если у данного элемента есть родительский элемента с атрибутом spellcheck, который не находится в состоянии по умолчанию, то: если ближайший такой родительский элемент содержащий атрибут spellcheck находится в истинном состоянии, то проверка выполнятся; в противном случае проверка выполнятся не будет.
В противном случае, если над элементом выполняется действие по умолчанию являющееся true-by-default, выступающим по умолчанию, то проверка выполнятся.
В противном случае, если над элементом выполняется действие по умолчанию являющееся true-by-default, выступающим по умолчанию, то проверка не выполнятся.
В противном случае, если элемент, находящийся в родительском элементе имеет собственную проверку, то проверка выполнятся.
В противном случае, проверка не выполнятся.

Если проводится проверка для слова/предложения/текста, агент пользователя должен указать орфографические и грамматические ошибки в этом тексте. Агентам пользователей следует учитывать и другую семантику, приведенную в документе, предлагая орфографию и исправление грамматических ошибок. Агенты пользователей могут использовать язык элемента, чтобы определить, какие правила орфографии и грамматики необходимо применять, или может использовать пользовательские настройки языка. Агентам пользователей следует использовать атрибуты элемента input, такие как pattern для того, чтобы убедиться, что полученное значение является допустимым, где это возможно.

Если проверка отключена, то агент пользователя не должен указывать орфографические или грамматические ошибки для данного текста.

Даже если проверка включена, агенты пользователей могут не отображать орфографические или грамматические ошибки в тексте, если агент пользователя сочтёт, что пользователь не заинтересован в проверке (например, текст уже присутствовавший при загрузки страницы, или там где пользователь не может вводить текст, или текст находится в элементах управления, которые не сфокусированы пользователем, или некоторые части адресов электронной почты, в которых web-браузер не уверен, были ли там орфографические ошибки). Метод forceSpellCheck(), при вызове на элементе, переопределяет поведение в нём, заставляя агент пользователя рассмотреть все орфографические и грамматические ошибки в тексте в данном элементе с включенной проверкой орфографии и грамматики, который представляет интерес для пользователя.

В следующих примерах используется элемент с ID="а", чтобы определить, необходимость проверки слова "Привет" на наличие орфографических ошибок. В данном примере проверки не будет.

<div contenteditable="true">
<span spellcheck="false">Прив</span><em>ет!</em>
</div>

В следующем примере элемент с ID="b" будет проверен на ошибки (первоначальный пробельный символ в значении атрибута элемента input заставляет проигнорировать значение данного атрибута, таким образом вместо него используется значение атрибута родительского элемента, независимо от значения по умолчанию).

<p spellcheck="true"><label>Имя: <input spellcheck=" false"></label>
</p>

Эта спецификация не определяет пользовательский интерфейс для проверки орфографии и грамматики. Агент пользователя может предложить проверку по требованию, может выполнять непрерывную проверку во время когда проверка уже включена, или может использовать другие интерфейсы.

5.7. Перетаскивание

* * *

5.7.7. Атрибут `draggable`

Все html элементы могут иметь атрибут draggable. Атрибут draggable является перечисляемым атрибутом. Он имеет три состояния. Первое состояние - это истина, и оно имеет ключевое слово true. Второе состояние - это ложь, и оно имеет ключевое значение false. Третье состояние – авто; оно не имеет ключевых слов, но это недостающее значение используется по умолчанию.

Истинное состояние означает, что элемент можно перетаскивать; ложное состояние соответственно означает, что перетаскивать нельзя. Состояние авто использует поведение агента пользователя по умолчанию.

Элемент с атрибутом draggable также должен иметь атрибут title в качестве имён элементов для не визуальных взаимодействий.

element . draggable [ = value ]: Возвращает true, если элемент можно перетаскивать; в противном случае возвращает false.
Можно установить, чтобы переопределить значение по умолчанию и установить атрибут draggable.

IDL атрибут draggable, значение которого зависит от содержания атрибута, как описано ниже, определяет можно ли перетаскивать элемент или нет. Как правило, перетягивать можно только выделенный текст, но несмотря на это элементы чьи IDL атрибуты draggable имеют значение true так же приобретают возможность перетягивания.

Если элемент имеет атрибут draggable находящийся в состоянии true, то IDL атрибут draggable должен вернуть true.

В противном случае, если элемент содержит атрибут draggable находящийся в состоянии false, то IDL атрибут draggable должен вернуть false.

В противном случае, элемент содержащий атрибут draggable находится в состоянии auto. Если элемент является img или object элементом, который представляет собой изображение или элементом a содержащим href атрибут, IDL атрибут draggable должен вернуть true; в противном случае, IDL атрибут draggable должен вернуть false.

Если IDL атрибуту draggable задать значение false, то атрибуту draggable должно быть установлено значение «false». Если IDL атрибуту draggable задать значение true, то атрибуту draggable должно быть установлено значение «true».

5.7.8. Атрибут `dropzone`

Все HTML элементы могут иметь атрибут dropzone с определённым значением. Если указано, то его значением должно быть неупорядоченное множество уникальных разделенных пробелами маркеров, которые состоят из ASCII символов без учёта регистра. Допустимы следующие значения:

copy: Указывает на то, что при перенесении любого элемента в элемент с данным атрибутом, данные переносимого элемента будут скопированы.
move: Указывает на то, что при перенесении любого элемента в элемент с данным атрибутом, данные переносимого элемента будут перемещены на новое место.
link: Указывает на то, что при перенесении любого элемента в элемент с данным атрибутом будет создана ссылка на исходные данные.
Любое ключевое слово длиной не менее восьми символов, начиная с ASCII символа без учёта регистра строки "string:": Указывает, что элементы с перемещаемыми данными элемента имеют вид Обычной Unicode строки и данные элемента перетаскиваются в виде строки значение, которой соответствует оставшемуся установленному ключевому слову.
Любое ключевое слово с шестью или более символами, начиная с ASCII символа без учёта регистра строки "file:": Указывает, что элементы с перемещаемыми данными элемента имеют вид Файла и данные элемента перетаскиваются в виде строки значение, которой соответствует оставшемуся установленному ключевому слову.

Значения, содержащиеся в атрибуте dropzone не должны быть больше, чем один из трех указанных значений обратной связи (copy, move, и link). Если ни одно из значений не указано, то используется значение copy.

Элемент с атрибутом dropzone также должен иметь атрибут title для обозначения названия элемента для невизуального взаимодействия.

Атрибут dropzone согласует перетаскивание хранящихся данных, если этапы обработки dropzone привести в соответствие.

Атрибут dropzone определяет операцию, если этапы обработки dropzone привести к указанной операции.

Этапы обработки dropzone соответствуют следующим шагам. Они либо соответствуют результатам, либо нет, а так же либо отдельно от этого результата, либо в указанной операции, как описано ниже.

Пусть значение будет значением атрибута dropzone.
Пусть ключевые слова будут результатом расщепления значения на пробелы.
Пусть соответствует false.
Пусть операция будет указана.
Для каждого значения в ключевых словах, если таковые имеются, в том порядке, в котором они были найдены в значении, выполняются следующие действия.
1. Пусть ключевое слово будет ключевым словом.
2. Если ключевое слово является одним из "copy", "move", или "link", то: выполните следующие подэтапы:
  1. Если операция по-прежнему не определена, то пусть операция будет строкой, заданной по ключевому слову.
  2. Перейдите к шагу, помеченному как конец нижеприведённого ключевого слова.
3. Если ключевое слово не содержит символ ":" (U+003A), или если первый такой символ в ключевом слове является либо первым символом, либо последним символом в строке, то перейдите к шагу обозначенному как конец нижеприведённого ключевого слова.
4. Пусть вид кода подстроки ключевого слова от первого символа в строке до последнего символа в строке, которые находятся перед первым символом ":" (U +003A) строки преобразуются в ASCII символы нижнего регистра.
5. Перейти к соответствующему шагу из списка ниже, на основе значения типа кода:
  
  Если типа кода является строкой "string"
  
  Пусть типом будет Обычная Обычной Unicode строки.
  
  Если типа кода является строкой "file"
  
  Пусть типом будет File.
  
  В противном случае
  
  Перейдите к шагу помеченному как конец нижеприведённого ключевого слова.
6. Пусть тип подстроки ключевого слова от первого символа после первого символа в строке ":" (U+003A), до последнего символа в строке, преобразуется в ASCII нижнего регистра.
7. Если существуют какие-либо элементы в перетаскиваемых данных, хранящихся в списке элемента, которые перетаскивают данные предмета в роли вида приведённом в виде, чьё перетаскивание элемента данных типа строки является типом, то допускается соответствие true.
8. Конец ключевого слова: перейдите к следующему ключевому слову, если таковые имеются, или если таковое отсутствует - воспользуйтесь следующим шагом в общем алгоритме.
Результаты алгоритма находятся в соответствии, если соответствуют true, и не иначе.

Результаты алгоритма находятся в указанной операции, если операция не определена. Указанная операция, если она указана, является одной данной операцией.

IDL атрибут dropzone должен вернуть содержимое атрибута с тем же именем.

В данном примере элемент div является местом, приготовленным с помощью атрибута dropzone к принятию перетаскиваемого файла изображения.

<div dropzone="copy file:image/png file:image/gif file:image/jpeg" ondrop="receive(event, this)">
<p>Переместите изображение сюда, чтобы оно отобразилось.</p>
</div>
<script>
function receive(event, element) {
  var data = event.dataTransfer.items;
  for (var i = 0; i < data.length; i += 1) {
    if ((data[i].kind == 'file') && (data[i].type.match('^image/'))) {
      var img = new Image();
      img.src = window.createObjectURL(data[i].getAsFile());
      element.appendChild(img);
    }
  }
}
</script>

* * *

5. Взаимодействие с пользователем

5.2. Инертные поддеревья

5.6. Редактирование

5.6.5. Проверка правописания и грамматики

5.7. Перетаскивание

5.7.7. Атрибут draggable

5.7.8. Атрибут dropzone

5.7.7. Атрибут `draggable`

5.7.8. Атрибут `dropzone`