HTML은 앞서 소개되었으나 이제는 JS 코드 작성 방법에 대해 주로 설명합니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no" />
<title>计算器</title>
<script type="text/javascript" src=""></script>
<script>
//点击按钮执行操作
var resultDom = document.getElementById("result"); //var 是定义变量，
var operate = true; //定义一个变量，防止运算符的连续操作
var xop = true; //定义一个变量，防止小数点可以连续输出
function command(num){ //function 是封装command
if(needclear==1){
needclear=0;
resultDom.value='';
}
var str = resultDom.value;
str =(str =="0"?"":str);
resultDom.value = str+num;
operate = true;
play(num);
}
//清空
function clearzero(m){
resultDom.value = 0;
play(m)
}
//计算等号
var needclear=0;
function equal(m){
needclear=1;
var result = resultDom.value.toString();
var r = eval(result);
resultDom.value =r;
play(m);
}
//小数点
function dot(m){
if(xop){ //对变量进行判断输出
var num = resultDom.value.toString();
num +=".";
resultDom.value = num;
xop = ture;
}
play(m);
}
//点击操作符
function tools(op,m){
if(operate){ //对运算符进行判断输出
var num = resultDom.value;
num = (num =="0"?"":num);
resultDom.value = num+op;
operate = false;
}
play(m);
}
//按键声音
function play(num){
var audioDom = document.getElementById("audio");
audioDom.innerHTML = "<embed src='wav/"+num+".wav' width='0' height='0'></embed>" //wav是声音素材的文件夹名称。
}
</script>
</body>
</html>각 함수에는 주석이 있습니다. 음성자료는 업로드가 불가능하므로 작성법만 알면 음성자료를 온라인으로 다운받아 직접 해볼 수 있습니다.
다음 섹션