javascript实现简单的可随机变色网页计算器示例
作者：aitaoke 时间：2024-04-16 09:37:07
本文实例讲述了javascript实现简单的可随机变色网页计算器。分享给大家供大家参考，具体如下：
该程序能实现简单的加、减、乘、除、求余，页面还添加了随机变换颜色的功能。
运行效果图如下：
完整实例代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Day 2 </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script>
function calculator(){
var selection=document.form.selection.value;
var numb1=document.form.number1.value;
var numb2=document.form.number2.value;
var relnum="";
switch(selection){
case "+":
relnum=parseFloat(numb1)+parseFloat(numb2);
break;
case '-':
relnum=numb1 - numb2;
break;
case '*':
relnum=numb1 * numb2;
break;
case '/':
if(numb2==0)
alert("wrong input! ");
relnum=numb1 / numb2;
break;
case '％':
relnum=numb1 ％ numb2;
break;
}
document.form.result.value=relnum;
}
function sound(){
document.all.sound.src="clock.wav";
}
function changeBgcolor(){
var bgc=document.getElementById("idbgc");
var rand="";
for(var i=0;i<6;i++){
rand+=Math.round(Math.random()*9)
}
bgc.style.backgroundColor='#'+rand;
}
</script>
</HEAD>
<BODY bgcolor="aliceblue" id="idbgc">
<h1>simple web calculator</h1>
<form name="form" action="">
<input type=text name="number1" style="width:80px ">
<select name="selection">
<option value='+'> + <option>
<option value='-'>-<option>
<option value='*'>*<option>
<option value='/'>/<option>
<option value='％'>％<option>
</select>
<input type=text name="number2" style="width:80px ">
<input type="button" value=" = " onclick="calculator(),changeBgcolor()">
<input type=text name="result" style="width:80px "><br>
<input type="reset" value="reset" onclick="changeBgcolor()">
</form>
</BODY>
</HTML>
希望本文所述对大家JavaScript程序设计有所帮助。
标签：javascript,网页,计算器
0
投稿猜你喜欢
Python argparse中的action=store_true用法小结
2023-07-31 22:35:02
java连接数据库增、删、改、查工具类
2024-01-21 22:01:48
Python queue模块功能大全
2023-02-23 23:42:27
Python实现带图形界面的炸金花游戏
2021-06-21 15:41:56
使用SQL语句将相同名的多行字段内容拼接(方法详解)
2024-01-15 00:11:13
Python基础学习之反射机制详解
2023-02-15 11:02:01
教你使用TensorFlow2识别验证码
2022-06-26 19:24:38
简易CSS相册源代码
2008-04-18 12:28:00
Python协程原理全面分析
2022-10-02 01:43:43
python数字类型math库原理解析
2021-11-27 16:34:50
Python使用OpenPyXL处理Excel表格
2022-07-29 21:10:21
Python集成学习之Blending算法详解
2022-09-28 04:31:35
Oracle AS关键字 提示错误
2011-04-18 12:42:00
Python爬取网易云音乐上评论火爆的歌曲
2021-09-16 11:49:53
小型分页的设计
2011-08-18 18:32:26
vue项目实现图片懒加载的简单步骤
2024-05-10 14:16:06
Python Learning 列表的更多操作及示例代码
2022-11-15 01:05:33
pygame实现键盘的连续监控
2023-09-26 11:17:10
Mysql 数据库访问类
2024-01-15 00:31:41
XML十项特点
2008-04-05 13:49:00