Home > Article > Web Front-end > Solution to the failure of the onforminput event of the output tag in HTML5
Solution to the failure of the onforminput event of the output tag in HTML5
- 黄舟Original
- 2017-07-03 10:43:223486browse
In this example on the official website, the onforminput event seems not to be executed, the code: 100db36a723c770d327fc0aef2ce13b1
<head>
<script type="text/javascript">
function resCalc()
{
numA=document.getElementById("num_a").value;
numB=document.getElementById("num_b").value;
document.getElementById("result").value=Number(numA)+Number(numB);
}
</script>
</head>
<body>
<p>使用 output 元素的简易计算器：</p>
<form onsubmit="return false">
<input id="num_a" /> +
<input id="num_b" /> =
<output id="result" onforminput="resCalc()"></output>
</form>
</body>Please give me some advice
Then I will give you some advice, the code has been The test passed, haha, the html5 tag, the core is not js.
Principle: Change output to input, and then use the onClick event.
To put it simply, change d22c446ec904399785cd0c4bfd85cff9d76c8de0b204cd1b17c9571b0bbcceb6 to 0a0c2e16b8e9477590d4968872e55237 That's it. Then after running, click directly on the last input box. Be sure to click on the input box.
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
function resCalc()
{
numA=document.getElementById("num_a").value;
numB=document.getElementById("num_b").value;
document.getElementById("result").value=Number(numA)+Number(numB);
}
</script>
</head>
<body>
<p>使用 output 元素的简易计算器：</p>
<form onsubmit="return false">
<input id="num_a" /> +
<input id="num_b" /> =
<input id="result" onclick="resCalc()" />
</form>
</body>
</html>I'm just confused about why the example on the official website doesn't work.
The code is wrong and the event method is wrong.
The above is the detailed content of Solution to the failure of the onforminput event of the output tag in HTML5. For more information, please follow other related articles on the PHP Chinese website!