Skip to content

Instantly share code, notes, and snippets.

@MasWag
Last active December 16, 2015 09:09
Show Gist options
  • Save MasWag/5410832 to your computer and use it in GitHub Desktop.
Save MasWag/5410832 to your computer and use it in GitHub Desktop.
JavaScriptの練習
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>電卓</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<style>
#dispBox { background-color: black; color:white;font-size:large;}
#numbuttons1,#numbuttons2,#numbuttons3,#operatorbuttons { float:left;width:25%;}
</style>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script
src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
<script>
var str = new String();
var dotFlag = false;
var push = function(a)
{
if (a == '.' && dotFlag)
return;
if( a != '+' && a != '-' && a != '*' && a != '/' && a != '.'){
if(document.getElementById('dispBox').firstChild.nodeValue == '0')
document.getElementById('dispBox').firstChild.nodeValue = a;
else
document.getElementById('dispBox').firstChild.nodeValue += a;
}
else {
var lastStr =
document.getElementById('dispBox').firstChild.nodeValue.charAt(document.getElementById('dispBox').firstChild.nodeValue.length
-1)
if( lastStr != '+' && lastStr != '-' && lastStr != '*' && lastStr != '/'
&& lastStr != '.'){
document.getElementById('dispBox').firstChild.nodeValue += a;
if ( a == '.' )
dotFlag = true;
else
dotFlag = false;
}
else{
var preLastStr =
document.getElementById('dispBox').firstChild.nodeValue.charAt(document.getElementById('dispBox').firstChild.nodeValue.length
-2)
if ( a != '*' && a != '/' && preLastStr != '+' && preLastStr != '-' && preLastStr != '*' && preLastStr != '/'
&& lastStr != '.' && a != lastStr ){
document.getElementById('dispBox').firstChild.nodeValue += a;
if ( a == '.' )
dotFlag = true;
else
dotFlag = false;
}
}
}
}
</script>
</head>
<body>
<div id="page1" data-role="page">
<header data-role="header">
<a href="index.html" data-icon="arrow-l">Top</a>
<h1>電卓</h1>
</header>
<div data-role="content" >
<p>JavaScriptで作った簡易電卓です。</p>
<p id="dispBox">0</p>
<input type="button" value="AC" onclick= "document.getElementById('dispBox').firstChild.nodeValue = 0;dotFlag = false;" />
<div id="numbuttons1" >
<input type="button" value="7" onclick="push('7')" />
<input type="button" value="4" onclick="push('4')" />
<input type="button" value="1" onclick="push('1')" />
<input type="button" value="." onclick="push('.')" />
</div>
<div id="numbuttons2" >
<input type="button" value="8" onclick="push('8')" />
<input type="button" value="5" onclick="push('5')" />
<input type="button" value="2" onclick="push('2')" />
<input type="button" value="0" onclick="push('0')" />
</div>
<div id="numbuttons3" >
<input type="button" value="9" onclick="push('9')" />
<input type="button" value="6" onclick="push('6')" />
<input type="button" value="3" onclick="push('3')" />
<input type="button" value="=" onclick="document.getElementById('dispBox').firstChild.nodeValue = eval(document.getElementById('dispBox').firstChild.nodeValue) ;dotFlag = document.getElementById('dispBox').firstChild.nodeValue.indexOf('.') != -1"/>
</div>
<div id="operatorbuttons" >
<input type="button" value="/" onclick="push('/')" />
<input type="button" value="*" onclick="push('*')" />
<input type="button" value="-" onclick="push('-')" />
<input type="button" value="+" onclick="push('+')" />
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment