HTML 使用For和Form属性的输出元素

示例

以下演示以<output>元素对[for]和[form]属性的使用为特色。请记住，<output> 需要JavaScript才能运行。如本示例所示，内联JavaScript通常以表格形式使用。尽管<input>元素是type="number"，它们的values不是数字，但它们是文本。所以，如果你需要value进行计算S，则必须在每次转换value：使用诸如成数parseInt()，parseFloat()，Number()，等。

现场演示

    <!--form1 will collect the values of in1 and in2 on 'input' event.-->
    <!--out1 value will be the sum of in1 and in2 values.-->    

<form id="form1" name="form1" oninput="out1.value = parseInt(in1.value, 10) + parseInt(in2.value, 10)">

  <fieldset>

    <legend>Output Example</legend>

      <input type="number" id="in1" name="in1" value="0">
    <br/>
    +
    <input type="number" id="in2" name="in2" value="0">

  </fieldset>

</form>

<!--[for] attribute enables out1 to display calculations for in1 and in2.-->
<!--[form] attribute designates form1 as the form owner of out1 even if it isn't a descendant.-->

<output name="out1" for="in1 in2" form="form1">0</output>