JS示例13-强制类型转换(简单求和)

2019-04-01  本文已影响0人  微小码

一、知识要点

1、字符串转数字
2、isNaN的使用
3、innerHTML

二、源码参考

<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <title>简单求和</title>
    <script>
        window.onload = function () {
            var oTxt1 = document.getElementById('txt1');
            var oTxt2 = document.getElementById('txt2');
            var oBtn = document.getElementById('btn1');
            var span1 = document.getElementById('span1');

            oBtn.onclick = function () {
                var n1 = parseInt(oTxt1.value);
                var n2 = parseInt(oTxt2.value);

                if (isNaN(n1)) { // 判断是否是数字
                    alert('您输入的第一个数字有误');
                } else if (isNaN(n2)) { // 判断是否是数字
                    alert('您输入的第二个数字有误');
                } else {
                    span1.innerHTML = "=" + (n1 + n2);
                }
            };
        };
    </script>
</head>

<body>
    <input id="txt1" type="text" />+
    <input id="txt2" type="text" /><span id="span1"></span>
    <input id="btn1" type="button" value="求和" />
</body>

</html>

三、运行效果

image.png
上一篇下一篇

猜你喜欢

热点阅读