Thread Rating:
  • 0 Votes - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Using the HTML5 output element
08-23-2011, 04:12 PM (This post was last modified: 08-23-2011 04:13 PM by haider.ali.)
Post: #1
Using the HTML5 output element
The output element represents the results of a calculation.It is a new html5 element that should always be used to display result.

I will explain with its attributes


<tittle> Output element</tittle>
&lt;script type="text/javascript"&gt;
    function calculation() {
        var o = document.getElementById("result");
        var num1 = document.getElementById("num1");
        var num2 = document.getElementById("num2");

        o.value = parseFloat(num1.value) + parseFloat(num2.value);
<input name="num1" type="number"> +
<input name="num2" type="number"> =
<output name="result" for="num1 num2"></output>
<button onclick="calculation()">Perform Calulation</button>

'for' attribute contain a list of space separated input element id's on which output tag is depended .


<form action="" id="numform">
<input name="numa" type="number"> +
<input name="numb" type="number"> =
<button onclick="calculation()">Perform Calulation</button>
<p>The output element below is outside the form, but still a part of it.</p>
<output name="result" form="numform" onforminput="value=numa.valueAsNumber + numb.valueAsNumber"></output>
you can add the calculation function in script tag from above to make it work


Possibly Related Threads...
Thread: Author Replies Views: Last Post
  Using the HTML5 meter element haider.ali 0 2,570 08-23-2011 03:41 PM
Last Post: haider.ali

User(s) browsing this thread: 1 Guest(s)