HTML、css、js的简单练习
制造一个计算机
html
<div> <div>0</div> <table cellspacing="0" cellpadding="0"> <tr> <td>清零</td> <td>退格</td> <td>开机</td> <td>/</td> </tr> <tr> <td>7</td> <td>8</td> <td>9</td> <td>*</td> </tr> <tr> <td>4</td> <td>5</td> <td>6</td> <td>-</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td>+</td> </tr> <tr> <td>0</td> <td>.</td> <td>+/-</td> <td>=</td> </tr> </table> </div>
css
.qpw{ border: 1px solid #000; width: 408px; height: 70px; font-size: 40px; text-align: right; line-height: 100px; } .kuang { width: 100px; height: 100px; }
js
var su = 0; $(‘.fl‘).click(function () { var th = $(this).text(); if(th==‘c‘){ $(‘.qpw‘).text(0); }else if(th==‘=‘){ var bk=$(‘.qpw‘).text(); su=eval(bk); $(‘.qpw‘).text(su); }else{ if(su==0 &&!isNaN(th)){ su=th; }else if(isNaN(th)){ var zh=su.substr(su.legth-1,1); if(isNaN(zh)){ su=su.substr(0,su.legth-1)+th }else{ su=su+th; } }else{ su=su+th; } $(‘.qpw‘).text(su); } })
全选
html
<table> <tr> <td><input type="checkbox" onchange="testChange()">全选</td> <td>姓名</td> <td>性别</td> <td>年龄</td> </tr> </table> <table> <tr> <td><input type="checkbox"></td> <td>张三</td> <td>男</td> <td>28</td> </tr> <tr> <td><input type="checkbox"></td> <td>打飞机</td> <td>女</td> <td>18</td> </tr> <tr> <td><input type="checkbox"></td> <td>李四</td> <td>不详</td> <td>???</td> </tr> </table>
js
function testChange() { var con = document.getElementById("contro"); var boxz = document.getElementsByName("box"); for (var i = 0; i < boxs.length; i++) { boxs[i].checked = con.checked;
删除
js
$(‘body‘).on(‘click‘, ‘.del‘, function () { $(this).parents(‘trs‘).remove(); })
编辑
$(‘body‘).on(‘click‘, ‘.edit input‘, function () { var text = $(this).text(); $(this).html(‘<input type="text" value=‘ + text + ‘>‘); $(this).children().focus(); }); $(‘body‘).on(‘click‘, ‘input‘, function () { return false; }); $(‘body‘).on(‘blur‘, ‘input‘, function () { var val = $(this).val(); $(this).parent().text(val); })
二维码
var qrcod=‘1234567890asdfghjklqwertyuiopzxcvbnm‘ var len=qrcod.length; var arr=qrcod.split(""); var qr=""; for(i=0;i<4;i++){ var j=parseInt(Math.random()*len) qr +=arr[j] } console.log(qr)
HTML、css、js的简单练习
标签:
原文地址:https://www.cnblogs.com/wangzihao147/p/12074079.html
,温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/39818.html
- 上一篇:Internal Server Error解决办法详解
- 下一篇:文件夹断点续传