利用js实现简单的加法运算,实现输入数字后,自动输出两个数的和。
工具/原料
DW
方法/步骤
1、首先实现如下图愕漓淤说所示的布局效果,其中h5模块的代码:<p>求和运算</p>&造婷用痃lt;form><divclass="f"><divclass="n1"><p>数字1:<inputtype="number"id="num1">+</p></div><divclass="n2"><inputtype="number"id="num2"></div><divclass="n3"><p>=<inputtype="number"id="num3"onFocus="add()"></p></div></div></form>
2、为了实现文字和输入框在垠捎吨稍同一行,用到了float属性,具体css模块代码如下:*{ margin:0; padding:惺绅寨瞀0; text-align:left;}.f{ width:1000px; height:800px; float:left; padding:10px; }.n1{ width:280px; height:20px; float:left;}.n2{ width:280px; height:20px; float:left;}.n3{ width:280px; height:20px; float:left; }
3、首先需要获取到第一个输入框的值:a=document.getElementById("num1").value;
4、然后需要获取到第二个输入框的值:b=document.getElementById("num2").value;
5、最后是实现两个输入数值的相加:sum=parseInt(a)+parseInt(b);
6、输出相加的结果:document.getElementById("num3").value=sum;