javascript开发计算器之JS代码
前面介绍了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>每个功能都会有注释。由于语音素材无法上传,所以知道写法就可以了,可以自己在网上下载声音素材,自己尝试一下。
neue Datei
<!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){
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>"
}
</script>
</body>
</html>
Vorschau
Clear
- Kursempfehlungen
- Kursunterlagen herunterladen
Die Kursunterlagen stehen derzeit nicht zum Download zur Verfügung. Die Mitarbeiter organisieren es derzeit. Bitte schenken Sie diesem Kurs in Zukunft mehr Aufmerksamkeit
Auch Studierende, die diesen Kurs gesehen haben, lernen
Lassen Sie uns kurz über die Gründung eines Unternehmens in PHP sprechen
Kurze Einführung in die Web-Frontend-Entwicklung
Umfangreiche, praktische Tianlongbabu-Entwicklung eines Mini-Version-MVC-Frameworks, das die Enzyklopädie-Website mit peinlichen Dingen imitiert
Erste Schritte mit der praktischen PHP-Entwicklung: Schnelle PHP-Erstellung [Small Business Forum]
Anmeldebestätigung und klassisches Message Board
Wissenssammlung über Computernetzwerke
Schnellstart-Node.JS-Vollversion
Der Frontend-Kurs, der Sie am besten versteht: HTML5/CSS3/ES6/NPM/Vue/...[Original]
Schreiben Sie Ihr eigenes PHP-MVC-Framework (40 Kapitel ausführlich/große Details/Muss gelesen werden, damit Neulinge vorankommen)
















