book51.ru

Инструменты пользователя

Инструменты сайта

  • Показать страницу
  • История страницы
  • Ссылки сюда
  • Оставить на чай
  • Экспорт в PDF
  • Наверх
    • Вы посетили:
    software:development:web:docs:web:html:global_attributes:contenteditable

    Различия

    Показаны различия между двумя версиями страницы.

    Ссылка на это сравнение

    Предыдущая версия справа и слеваПредыдущая версия
    Следующая версия    		Предыдущая версия
    software:development:web:docs:web:html:global_attributes:contenteditable [2024/03/03 12:41] – [HTML глобальный атрибут: contenteditable (редактируемый контент)] vladpolskiysoftware:development:web:docs:web:html:global_attributes:contenteditable [2024/03/03 17:42] (текущий) – [HTML глобальный атрибут: contenteditable (редактируемый контент)] vladpolskiy
    Строка 1: Строка 1:
     ====== HTML глобальный атрибут:  contenteditable (редактируемый контент) ====== ====== HTML глобальный атрибут:  contenteditable (редактируемый контент) ======
      
    -[[software:development:web:docs:web:html:global_attributes|Глобальный атрибут]] **contenteditable ** это перечисляемый атрибут, указывающий, должен ли пользователь редактировать элемент. Если это так, браузер модифицирует свой виджет, чтобы разрешить редактирование.contenteditable+[[software:development:web:docs:web:html:global_attributes|Глобальный атрибут]] **contenteditable ** - это [[software:development:web:docs:glossary:enumerated|перечисляемый]] атрибут, указывающий, должен ли пользователь редактировать элемент. Если это так, браузер модифицирует свой виджет, чтобы разрешить редактирование.contenteditable
      
     Можно удалять текст и вводить новый. Также работают стандартные команды вроде отмены, вставки текста из буфера и др. Можно удалять текст и вводить новый. Также работают стандартные команды вроде отмены, вставки текста из буфера и др.
    Строка 21: Строка 21:
     <WRAP left round info 100%> <WRAP left round info 100%>
     **Примечание**\\   **Примечание**\\  
    -  * ''Атрибут autofocus'' применяется ко всем элементам, а не только к элементам управления формой. Например, его можно использовать в редактируемой области. +Хотя допустимые значения включают trueи false, этот атрибут является [[software:development:web:docs:glossary:enumerated|перечислимым]], а не логическим .
    -  * Не более одного элемента в документе или диалоге может иметь атрибут автофокуса. Если применить к нескольким элементам, фокус получит первый из них.+
     </WRAP> </WRAP>
      
    Строка 28: Строка 27:
      
     <code> <code>
    -<button autofocus>...</button>+contenteditable="true | false"
     </code> </code>
     +
      
     <code> <code>
    -<input name="q" autofocus />+<h1 contenteditable="false">Редактирование запрещено</h1>
     </code> </code>
      
     <code> <code>
    -<input type="..." autofocus> +  <p contenteditable="true">Редактирование разрешено</p>
    -<input type="..." autofocus=""> +
    -<input type="..." autofocus="autofocus">+
     </code> </code>
      
     =====Значения атрибута===== =====Значения атрибута=====
    -Нет.+  * **true** или **пустая строка**-   Включает режим редактирования. 
     +  * **false** -   Запрещает редактирование элемента. 
     +  * **plaintext-only**, что указывает на то, что необработанный текст элемента доступен для редактирования, но форматирование расширенного текста отключено. 
     + 
     +Вместо **true** допустимо указывать пустое значение (contenteditable="") или вообще его не писать (contenteditable). 
     + 
     +Значение по умолчанию: По умолчанию наследует значение родителя. 
     + 
     +Если этот атрибут отсутствует или его значение недопустимо, его значение наследуется от родительского элемента: поэтому элемент доступен для редактирования, если его родительский элемент доступен для редактирования. 
     + 
     +=====Применяется к тегам=====
      
    -Значение по умолчанию: По умолчанию это значение выключено.+[[software:development:web:docs:web:html:element:a|<a>]],  
     +[[software:development:web:docs:web:html:element:abbr|<abbr>]],  
     +[[software:development:web:docs:web:html:element:area|<area>]],              
     +[[software:development:web:docs:web:html:element:article|<article>]],      
     +[[software:development:web:docs:web:html:element:aside|<aside>]],              
     +[[software:development:web:docs:web:html:element:audio|<audio>]],           
     +[[software:development:web:docs:web:html:element:b|<b>]],                
     +[[software:development:web:docs:web:html:element:basefont|<basefont>]],  
     +[[software:development:web:docs:web:html:element:bdo|<bdo>]],  
     +[[software:development:web:docs:web:html:element:blockquote|<blockquote>]],  
     +[[software:development:web:docs:web:html:element:body|<body>]],                  
     +[[software:development:web:docs:web:html:element:button|<button>]],               
     +[[software:development:web:docs:web:html:element:caption|<caption>]],                
     +[[software:development:web:docs:web:html:element:cite|<cite>]],  
     +[[software:development:web:docs:web:html:element:code|<code>]],  
     +[[software:development:web:docs:web:html:element:col|<col>]],  
     +[[software:development:web:docs:web:html:element:colgroup|<colgroup>]],  
     +[[software:development:web:docs:web:html:element:dd|<dd>]],                 
     +[[software:development:web:docs:web:html:element:dfn|<dfn>]],  
     +[[software:development:web:docs:web:html:element:dir|<dir>]] {{:icons:16:hourglass-select.png?|Устаревший. Не для использования на новых web-сайтах.}},  
     +[[software:development:web:docs:web:html:element:div|<div>]],  
     +[[software:development:web:docs:web:html:element:dl|<dl>]],  
     +[[software:development:web:docs:web:html:element:dt|<dt>]],  
     +[[software:development:web:docs:web:html:element:em|<em>]],  
     +[[software:development:web:docs:web:html:element:fieldset|<fieldset>]],  
     +[[software:development:web:docs:web:html:element:h1|<h1>]],  
     +[[software:development:web:docs:web:html:element:h1|<h2>]],  
     +[[software:development:web:docs:web:html:element:h1|<h3>]],  
     +[[software:development:web:docs:web:html:element:h1|<h4>]],  
     +[[software:development:web:docs:web:html:element:h1|<h5>]],  
     +[[software:development:web:docs:web:html:element:i|<i>]],           
     +[[software:development:web:docs:web:html:element:input|<input>]],         
     +[[software:development:web:docs:web:html:element:ins|<ins>]],            
     +[[software:development:web:docs:web:html:element:kbd|<kbd>]],            
     +[[software:development:web:docs:web:html:element:label|<label>]],         
     +[[software:development:web:docs:web:html:element:legend|<legend>]],       
     +[[software:development:web:docs:web:html:element:li|<li>]],              
     +[[software:development:web:docs:web:html:element:menu|<menu>]],              
     +[[software:development:web:docs:web:html:element:ol|<ol>]],               
     +[[software:development:web:docs:web:html:element:option|<option>]],         
     +[[software:development:web:docs:web:html:element:pre|<pre>]],             
     +[[software:development:web:docs:web:html:element:q|<q>]],               
     +[[software:development:web:docs:web:html:element:samp|<samp>]],            
     +[[software:development:web:docs:web:html:element:select|<select>]],           
     +[[software:development:web:docs:web:html:element:span|<span>]],           
     +[[software:development:web:docs:web:html:element:strong|<strong>]],        
     +[[software:development:web:docs:web:html:element:sub|<sub>]],           
     +[[software:development:web:docs:web:html:element:sup|<sup>]],              
     +[[software:development:web:docs:web:html:element:table|<table>]],         
     +[[software:development:web:docs:web:html:element:tbody|<tbody>]],          
     +[[software:development:web:docs:web:html:element:td|<td>]],                
     +[[software:development:web:docs:web:html:element:textarea|<textarea>]],     
     +[[software:development:web:docs:web:html:element:tr|<tr>]],             
     +[[software:development:web:docs:web:html:element:ul|<ul>]],        
     +[[software:development:web:docs:web:html:element:var|<var>]] 
      
     =====Доступность===== =====Доступность=====
      
    -Автоматическая фокусировка элемента управления формой может сбить с толку людей с нарушениями зрения, использующих технологию чтения с экрана, и людей с когнитивными нарушениями. Если ''autofocus'' присвоено значение, программы чтения с экрана «телепортируют» пользователя в элемент управления формы, не предупреждая его заранее.+Вы можете установить цвет, используемый для рисования курсора вставки текста, с помощью [[software:development:web:docs:glossary:caret|Caret]] свойства CSS [[software:development:web:docs:web:css:caret-color|caret-color]].
      
    -При применении атрибута уделяйте особое внимание доступности ''autofocus''. Автоматическая фокусировка на элементе управления может привести к прокрутке страницы при загрузке. Фокус также может привести к отображению динамической клавиатуры на некоторых сенсорных устройствах. В то время как программа чтения с экрана объявляет метку элемента управления формой, получающего фокус, программа чтения с экрана ничего не объявляет перед меткой, и зрячий пользователь на небольшом устройстве в равной степени пропустит контекст, созданный предыдущим содержимым.+Элементы, которые с помощью атрибута становятся редактируемыми и, следовательно, интерактивными, ''contenteditable'' могут быть сфокусированы. Они участвуют в последовательной навигации с помощью клавиатуры. Однако элементы с ''contenteditable'' атрибутом, вложенным в другие ''contenteditable'' элементы, по умолчанию не добавляются в последовательность табуляции. Вы можете добавить вложенные ''contenteditable'' элементы в последовательность навигации с помощью клавиатуры, указав значение ''tabindex'' ([[software:development:web:docs:web:html:global_attributes:tabindex|tabindex="0"]]).
      
     =====Ссылки и Дополнения===== =====Ссылки и Дополнения=====
    -  * [[https://html.spec.whatwg.org/multipage/interaction.html#dom-fe-autofocus|Стандарт HTML]] +  * [[https://html.spec.whatwg.org/multipage/interaction.html#attr-contenteditable|Стандарт HTML # attr-contenteditable]] 
    -  * [[https://programmerbook.ru/html/input/autofocus/|programmerbook.ru - Атрибут autofocus]] +  * [[https://programmerbook.ru/html/input/contenteditable/|programmerbook.ru - Атрибут contenteditable]] 
    -  * [[https://htmlbook.ru/html/button/autofocus|htmlbook.ru - Атрибут autofocus]]+  * [[https://htmlbook.ru/html/attr/contenteditable|htmlbook.ru - Атрибут contenteditable]]
    software/development/web/docs/web/html/global_attributes/contenteditable.1709458894.txt.gz · Последнее изменение: 2024/03/03 12:41 — vladpolskiy