H5APP开发（一）：简单计算器（使用Hbuild）

来源：互联网发布：xmind中文破解版 mac 编辑：程序博客网时间：2024/06/08 17:31

1、计算器代码

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title>    <meta name="viewport" content="width=device-width,initial-scale:1.0">    <style>        html,body{            height: 100%;            overflow: hidden;        }        div{            box-sizing: border-box;            font: 26px/30px '微软雅黑','sans-serif';        }        #main{            height: 100%;        }        #run{            height: 20%;        }        .c3{            float: left;            width: 25%;            height: 16%;            border: 1px solid gray;            line-height: 100px;            text-align: center;            height: 3em;            line-height: 3em;        }        .c6{            width: 50%;            height: 16%;            float: left;            border: 1px solid gray;            line-height: 100px;            text-align: center;            height: 3em;            line-height: 3em;        }    </style></head><body>    <div id="main">        <div id="run"></div>        <div class="c3">AC</div>        <div class="c3">+/-</div>        <div class="c3">back</div>        <div class="c3">/</div>        <div class="c3">7</div>        <div class="c3">8</div>        <div class="c3">9</div>        <div class="c3">-</div>        <div class="c3">4</div>        <div class="c3">5</div>        <div class="c3">6</div>        <div class="c3">+</div>        <div class="c3">1</div>        <div class="c3">2</div>        <div class="c3">3</div>        <div class="c3">*</div>        <div class="c6">0</div>        <div class="c3">.</div>        <div class="c3">=</div>    </div></body><script>    var main = document.getElementById('main');    var run = document.getElementById('run');    main.onclick = function (ev) {        var el = ev.target;        //如果点击的不是类名以 c3 c6 开头的直接return        if(el.className.indexOf('c')!=0){            return;        }        if(el.innerHTML=='AC'){            run.innerHTML='';//清除全部        }else if(el.innerHTML=='back'){            run.innerHTML=run.innerHTML.substr(0,run.innerHTML.length-1);//保留下来的长度，前删一位        }else if(el.innerHTML=='='){            run.innerHTML=eval(run.innerHTML);//eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。        }else{            run.innerHTML += el.innerHTML;        }    }</script></html>

2、下载Hbuild打包app
打开Hbuild,新建–移动app–在index.html文件内写入代码–打包即可。

阅读全文

0 0