Solution to the failure of the onforminput event of the output tag in HTML5-HTML Tutorial-php.cn

Home

Web Front-end

HTML Tutorial

Solution to the failure of the onforminput event of the output tag in HTML5

黄舟

Jul 03, 2017 am 10:43 AM

html5 output

In this example on the official website, the onforminput event seems not to be executed, the code:

<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>

Copy after login

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 to 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>

Copy after login

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!

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn