首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

简略的js加法器

2012-08-25 
简单的js加法器在網上找來的一篇不錯js加法器的程序,供大家一起學習!DOCTYPE html PUBLIC -//W3C//DTD X

简单的js加法器
在網上找來的一篇不錯js加法器的程序,供大家一起學習

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--文档规范-->
<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><!--字符集-->
    <title>加法器</title><!--标题集-->
    <style type="text/css">
        td{border-width:2px;width:100px;}
        input{width:200px;}
        #output{width:200px; margin:2px;}
        button{width:50px;}
        td:nth-child(2n-1){width:400px; text-align:center;}
        tr:nth-child(2n-1){background-color:#eeeeee;}
    </style>
    <h3>加法器</h3>
    <script type="text/javascript">
        var i = 0;
        function del(x){
            var index = x.parentNode.parentNode.rowIndex;
            document.getElementById("addall").deleteRow(index);
            sum();
        }
        function add(){
            var tr = document.createElement("tr");
            var td1 = document.createElement("td");
            var input = document.createElement("input");
            input.name = "shit";
            input.onmouseout=function(){sum();}
            td1.appendChild(input);
            tr.appendChild(td1);
            var td2 = document.createElement("td");
            var btn = document.createElement("button");
            btn.onclick = function(){del(this);}
            btn.innerHTML = "del";
            td2.appendChild(btn);
            tr.appendChild(td2);
            document.getElementsByTagName("tbody")[0].appendChild(tr);
        }
        function sum(){
            var shits = document.getElementsByName("shit");
            var cnt = 0;
            for(var i = 0; i < shits.length; i++){
            //  alert(shits[i].value);
                var str = shits[i].value.match(/[-+]?\d+/g);
                if(str != null)
                    shits[i].value = str[0];   
                else{
            //      alert(x);
                    shits[i].value = "";
                }
                if(!isNaN(shits[i].value) && shits[i].value != ""){

                    cnt += parseInt(shits[i].value,10);
                }
            }
            if(isNaN(cnt))cnt = 0;
            document.getElementById("output").value = cnt;
        }

    </script>
    </head>
    <body>
        <button onclick=add()>添加</button>
        <table id="addall">
            <tr>
                <td>价格</td>
                <td>删除键</td>
            </tr>
            <tr>
                <td><input name="shit" onmouseout=sum()></input></td>
                <td><button onclick=del(this)>del</button></td>
            </tr>
        </table>
        <input id="output" disabled=disabled>总计</input>
    </body>
</html>

热点排行