[ru] fix MacroLiveSampleError on Web/HTML/Element/input subpages (#…

…16964) * [ru]: fix broken links on docs/Web/HTML/Element/input/file * [ru]: fix MacroLiveSampleError on docs/Web/HTML/Element/input/file (#12578) * [ru]: improve docs/Web/HTML/Element/input/file translation * [ru]: move 'Technical summary' to right place on docs/Web/HTML/Element/input/file * [ru]: update 'Technical summary' on docs/Web/HTML/Element/input/file * [ru]: fix MacroLiveSampleError on docs/Web/HTML/Element/input/password (#12578) * [ru]: fix MacroLiveSampleError on docs/Web/HTML/Element/input/radio (#12578)
mdn · Dec 3, 2023 · eb4a142 · eb4a142
1 parent 9a84a81
commit eb4a142
Show file tree

Hide file tree

Showing 3 changed files with 58 additions and 34 deletions.
diff --git a/files/ru/web/html/element/input/file/index.md b/files/ru/web/html/element/input/file/index.md
@@ -5,26 +5,15 @@ slug: Web/HTML/Element/input/file
 
 {{HTMLSidebar}}
 
-{{HTMLElement("input")}} элемент с атрибутом **`type="file"`** позволяет пользователю выбрать один файл или более из файлового хранилища своего устройства. После выбора эти файлы могут быть загружены на сервер при помощи [формы](/ru/docs/Learn/HTML/Forms), или обработаны JavaScript и [File API](/ru/docs/Using_files_from_web_applications).
+{{HTMLElement("input")}} элемент с атрибутом **`type="file"`** позволяет пользователю выбрать один файл или более из файлового хранилища своего устройства. После выбора эти файлы могут быть загружены на сервер при помощи [формы](/ru/docs/Learn/Forms), или обработаны JavaScript и [File API](/ru/docs/Web/API/File_API/Using_files_from_web_applications).
 
-```html
-<input name="myFile" type="file" />
-```
-
-{{EmbedLiveSample('file-example', 650, 40)}}
+{{EmbedInteractiveExample("pages/tabbed/input-file.html", "tabbed-shorter")}}
 
-| **[Value](#value)**         | {{domxref("DOMString")}} представляет собой путь до выбранного файла.                                                                                              |
-| --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
-| **Действия**                | {{event("change")}} и{{event("input")}}                                                                                                                            |
-| **Поддерживаемые атрибуты** | [`accept`](/ru/docs/Web/HTML/Element/input#accept), [`multiple`](/ru/docs/Web/HTML/Element/input#multiple), [`required`](/ru/docs/Web/HTML/Element/input#required) |
-| **IDL атрибуты**            | `files` and `value`                                                                                                                                                |
-| **Методы**                  | {{domxref("HTMLInputElement.select", "select()")}}                                                                                                                 |
+## Значение
 
-## Value
+Атрибут [`value`](/ru/docs/Web/HTML/Element/input#value) элемента `input` содержит строку, представляющую путь к выбранному файлу или файлам. Если пользователь выбрал несколько файлов, `value` представляет первый файл из списка. Остальные файлы можно определить используя [свойство `HTMLInputElement.files` элемента `input`](/ru/docs/Web/API/File_API/Using_files_from_web_applications#getting_information_about_selected_files).
 
-Атрибут [`value`](/ru/docs/Web/HTML/Element/input#value) элемента input содержит {{domxref("DOMString")}}, который представляет путь к выбранным файлам. Если пользователь выбрал несколько файлов, `value` представляет первый файл из списка. Остальные файлы можно определить используя {{domxref("HTMLInputElement.files")}} свойство элемента input.
-
-> **Примечание:**1. Если выбрано несколько файлов, строка представляет собой первый выбранный файл. JavaScript предоставляет доступ к остальным файлам через свойство [`FileList`](</ru/docs/Using_files_from_web_applications#Getting_information_about_selected_file(s)>). 2. Если не выбрано ни одного файла, .строка равна `""` (пустая). 3. Строка [начинается с `C:\fakepath\`](https://html.spec.whatwg.org/multipage/input.html#fakepath-srsly), для предотвращения определения файловой структуры пользователя вредоносным ПО.
+> **Примечание:** Значение [всегда представляет собой имя файла, начинающееся с `C:\fakepath\`](https://html.spec.whatwg.org/multipage/input.html#fakepath-srsly) и не является настоящим расположением файла. Это сделано для того, чтобы вредоносное ПО не могло получить информацию о файловой структуре пользователя.
 
 ## Additional attributes
 
@@ -57,7 +46,7 @@ div {
 
 This produces the following output:
 
-{{EmbedLiveSample('A_basic_example', 650, 60)}}
+{{EmbedLiveSample('A_basic_example', 650, 90)}}
 
 > **Примечание:** You can find this example on GitHub too — see the [source code](https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/simple-file.html), and also [see it running live](https://mdn.github.io/learning-area/html/forms/file-examples/simple-file.html).
 
@@ -69,7 +58,7 @@ When the form is submitted, each selected file's name will be added to URL param
 
 ### Getting information on selected files
 
-The selected files' are returned by the element's {{domxref("HTMLElement.files", "files")}} property, which is a {{domxref("FileList")}} object containing a list of {{domxref("File")}} objects. The `FileList` behaves like an array, so you can check its `length` property to get the number of selected files.
+The selected files' are returned by the element's `HTMLInputElement.files` property, which is a {{domxref("FileList")}} object containing a list of {{domxref("File")}} objects. The `FileList` behaves like an array, so you can check its `length` property to get the number of selected files.
 
 Each `File` object contains the following information:
 
@@ -90,7 +79,7 @@ Each `File` object contains the following information:
 
 ### Limiting accepted file types
 
-Often you won't want the user to be able to pick any arbitrary type of file; instead, you often want them to select files of a specific type or types. For example, if your file input lets users upload a profile picture, you probably want them to select web-compatible image formats, such as [JPEG](/ru/docs/Glossary/jpeg) or [PNG](/ru/docs/Glossary/PNG).
+Often you won't want the user to be able to pick any arbitrary type of file; instead, you often want them to select files of a specific type or types. For example, if your file input lets users upload a profile picture, you probably want them to select web-compatible image formats, such as [JPEG](/ru/docs/Glossary/JPEG) or [PNG](/ru/docs/Glossary/PNG).
 
 Acceptable file types can be specified with the [`accept`](/ru/docs/Web/HTML/Element/input#accept) attribute, which takes a comma-separated list of allowed file extensions or MIME types. Some examples:
 
@@ -125,7 +114,7 @@ div {
 
 This produces a similar-looking output to the previous example:
 
-{{EmbedLiveSample('Limiting_accepted_file_types', 650, 60)}}
+{{EmbedLiveSample('Limiting_accepted_file_types', 650, 90)}}
 
 > **Примечание:** You can find this example on GitHub too — see the [source code](https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/file-with-accept.html), and also [see it running live](https://mdn.github.io/learning-area/html/forms/file-examples/file-with-accept.html).
 
@@ -337,6 +326,49 @@ The example looks like this; have a play:
 
 {{EmbedLiveSample('Examples', '100%', 200)}}
 
+## Техническое резюме
+
+<table class="properties">
+  <tbody>
+    <tr>
+      <td><strong><a href="#значение">Значение</a></strong></td>
+      <td>Строка, содержащая путь к файлу</td>
+    </tr>
+    <tr>
+      <td><strong>События</strong></td>
+      <td>{{domxref("HTMLElement/change_event", "change")}} и {{domxref("HTMLElement/input_event", "input")}}</td>
+    </tr>
+    <tr>
+      <td><strong>Поддерживаемые общие атрибуты</strong></td>
+      <td><a href="/ru/docs/Web/HTML/Element/input#attr-required"><code>required</code></a></td>
+    </tr>
+    <tr>
+      <td><strong>Дополнительные атрибуты</strong></td>
+      <td>
+        <a href="/ru/docs/Web/HTML/Element/input#attr-accept"><code>accept</code></a>,
+        <a href="/ru/docs/Web/HTML/Attributes/capture"><code>capture</code></a>,
+        <a href="/ru/docs/Web/HTML/Element/input##attr-multiple"><code>multiple</code></a>
+      </td>
+    </tr>
+    <tr>
+      <td><strong>IDL-атрибуты</strong></td>
+      <td><code>files</code> и <code>value</code></td>
+    </tr>
+    <tr>
+      <td><strong>DOM-интерфейс</strong></td>
+      <td>{{domxref("HTMLInputElement")}}</td>
+    </tr>
+    <tr>
+      <td><strong>Методы</strong></td>
+      <td>{{domxref("HTMLInputElement.select", "select()")}}</td>
+    </tr>
+    <tr>
+      <td><strong>Неявная ARIA-роль</strong></td>
+      <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role"><code>нет соответствующей роли</code></a></td>
+    </tr>
+  </tbody>
+</table>
+
 ## Specifications
 
 {{Specifications}}
@@ -347,4 +379,4 @@ The example looks like this; have a play:
 
 ## See also
 
-- [Using files from web applications](/ru/docs/Using_files_from_web_applications) — contains a number of other useful examples related to `<input type="file">` and the [File API](/ru/docs/Web/API/File).
+- [Using files from web applications](/ru/docs/Web/API/File_API/Using_files_from_web_applications) — contains a number of other useful examples related to `<input type="file">` and the [File API](/ru/docs/Web/API/File).
diff --git a/files/ru/web/html/element/input/password/index.md b/files/ru/web/html/element/input/password/index.md
@@ -7,16 +7,12 @@ slug: Web/HTML/Element/input/password
 
 {{HTMLElement("input")}} элементы типа **`"password"`** предоставляют пользователю возможность безопасного ввода пароль. Элемент представлен как однострочный текстовый редактор, в котором текст затенён, чтобы его нельзя было прочитать, как правило, путём замены каждого символа другим символом, таким как звёздочка ("\*") или точка ("•"). Этот символ будет меняться в зависимости от {{Glossary("user agent")}} и {{Glossary("OS")}}.
 
+{{EmbedInteractiveExample("pages/tabbed/input-password.html", "tabbed-standard")}}
+
 Особенности работы процесса ввода могут отличаться от браузера к браузеру; мобильные устройства, например, часто отображают вводимый символ на мгновение, прежде чем закрывать его, чтобы позволить пользователю быть уверенным, что они нажали клавишу, которую они хотели нажать; это полезно, учитывая небольшой размер клавиш и лёгкость, с которой может быть нажата неправильная, особенно на виртуальных клавиатурах.
 
 > **Примечание:** Любые формы, содержащие конфиденциальную информацию, такую как пароли (например, формы входа), должны обслуживаться через HTTPS; В Firefox теперь реализованы несколько механизмов для предупреждения от небезопасных форм входа в систему - см. [Небезопасные пароли](/ru/docs/Web/Security/Insecure_passwords). Другие браузеры также реализуют аналогичные механизмы.
 
-```html
-<input id="userPassword" type="password" />
-```
-
-{{EmbedLiveSample("Basic_example", 600, 40)}}
-
 | **[Value](#value)**               | {{domxref("DOMString")}} представляет пароль или пустую строку                                                                                                                                                                                                                                                                                                                                                                                                                                                                       |
 | --------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
 | **События**                       | {{event("change")}} и {{event("input")}}                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             |

diff --git a/files/ru/web/html/element/input/radio/index.md b/files/ru/web/html/element/input/radio/index.md
@@ -5,15 +5,11 @@ slug: Web/HTML/Element/input/radio
 
 {{HTMLSidebar}}
 
-Атрибут **type** тега `<input>` со значением **`radio`** обычно используется для создания группы радиокнопок (переключателей), описывающих набор взаимосвязанных параметров. Одновременно пользователь может выбрать лишь одну радиокнопку из предложенных. Радиокнопки обычно отображаются как небольшие кружки, которые заполняются или подсвечиваются при наведении.
+Атрибут **type** тега `<input>` со значением **`radio`** обычно используется для создания группы радиокнопок (переключателей), описывающих набор взаимосвязанных параметров.
 
-```html
-<input type="radio" id="radioButton" />
-```
-
-{{ EmbedLiveSample('Basic_example', 600, 30) }}
+Одновременно пользователь может выбрать лишь одну радиокнопку из предложенных. Радиокнопки обычно отображаются как небольшие кружки, которые заполняются или подсвечиваются, когда выбраны.
 
-Исходный код к данному интерактивному примеру находиться на GitHub репозитории. Если вы желаете внести свой вклад в проект интерактивных примеров, то склонируйте удалённый репозиторий [https://github.com/mdn/interactive-examples](https://github.com/mdn/interactive-examples) и отправьте нам запрос на включение сделанных вами изменений «pull request».
+{{EmbedInteractiveExample("pages/tabbed/input-radio.html", "tabbed-standard")}}
 
 Радиокнопки называются так потому, что выглядят и функционируют в схожей манере с кнопками старомодных радиоприёмников, подобных представленному ниже.