您的位置:首页 > Web前端 > JavaScript

javascript:从 复选框来选中俩个数值,然后从单选框按钮来选择加减乘除运算符,实现简单的计算器.

2014-06-07 16:14 741 查看
<!DOCTYPE html>

<html>
<head>
</head>

<body id="body" onload="init();">

<input type="button" id="b" value="Plus" onclick="cal();" /><br>

<div id="result">
</div>

<input type="radio" id="plus" name="plusandminus" value="plus"/><span>+</sapn>
<input type="radio" id="minus" name="plusandminus" value="minux"/><span>-</sapn>
<input type="radio" id="multiply" name="multiplyanddivide" value="multiply"/><span>*</sapn>
<input type="radio" id="divide" name="multiplyanddivide" value="divide"/><span>/</sapn>
<br><br>

<script type="text/javascript">

function init() {

for(i=0; i<100; i++) {
checkBox=document.createElement("input");
checkBox.setAttribute("type" , "checkbox");
checkBox.setAttribute("id" , "cb"+i);
checkBox.setAttribute("value" , i);
body.appendChild(checkBox);

span=document.createElement("span");
span.innerHTML=i;
body.appendChild(span);
}

}
function cal() {
if(document.getElementById("plus").checked) {
sum = 0;
for(i=0; i<100; i++) {
cb = document.getElementById("cb"+i);
if(cb.checked) {
sum = parseInt(sum) + parseInt(cb.value);
}
}
document.getElementById("result").innerHTML += sum + "  ";
}

if(document.getElementById("minus").checked) {
sum = null;
for(i=0; i<100; i++) {
cb = document.getElementById("cb"+i);
if(cb.checked) {
if(sum == null) {
sum = parseInt(cb.value);
continue;
}
sum = parseInt(sum) - parseInt(cb.value);
}
}
document.getElementById("result").innerHTML += sum;
}

if(document.getElementById("multiply").checked) {
sum = 1;
for(i=0; i<100; i++) {
cb = document.getElementById("cb"+i);
if(cb.checked) {
sum = parseInt(sum) * parseInt(cb.value);
}
}
document.getElementById("result").innerHTML += sum;
}

if(document.getElementById("divide").checked) {
sum = null;
for(i=0; i<100; i++) {
cb = document.getElementById("cb"+i);
if(cb.checked) {
if(sum == null) {
sum = parseInt(cb.value);
continue;
}
sum = parseInt(sum) / parseInt(cb.value);
}
}
document.getElementById("result").innerHTML += sum;
}

}
</script>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐