Элемент output

Атрибут Описание
Глобальные атрибуты Атрибуты, доступные любому элементу HTML5. Полную документацию по этим атрибутам см.: Глобальные атрибуты MDN
name Уникальное имя для элемента output. Этот атрибут используется для сбора значений при отправке формы.
for Список идентификаторов элементов управления, разделенных пробелами, (например, <input id = "inp1"> для значения - "inp1"), с которыми связан элемент output.
form Идентификатор формы, с которой связан элемент output. Если output фактически находится за пределами формы, этот атрибут будет гарантировать, что вывод по-прежнему принадлежит форме и входить в соответствующие коллекции указанной формы.

В следующей примере используется элемент <output> c атрибутами for и form. Имейте в виду, что для работы <output> необходим JavaScript. Встроенный JavaScript обычно используется в формах, как показано в этом примере. Хотя элементы <input> имеют атрибут type = "number", их значения не являются числами, они являются текстом. Поэтому, если вам нужны значения, которые нужно вычислить, вы должны преобразовать каждое значение в число, используя такие методы, как parseInt(), parseFloat(), Number() и т. д.

Демонстрация кода

<!--form1 собирает значения с  in1 и in2 элементов 'input'.-->
<!--out1 рассчитывает сумму значений in1 и in2.-->
<form id="form1" name="form1" oninput="out1.value = parseInt(in1.value, 10) + parseInt(in2.value, 10)">
    <fieldset>
        <legend>Пример использования  Output</legend>
        <input type="number" id="in1" name="in1" value="0">
        +
        <input type="number" id="in2" name="in2" value="0">
    </fieldset>
</form>
<!--атрибут for позволяет out1 отображать вычисления in1 и in2.-->
<!--атрибут form указывает, что out1 относится  к form1, даже если не является его потомком.-->
<output name="out1" for="in1 in2" form="form1">0</output>
Пример использования Output +
0