我无法得到指数,百分比,我的JavaScript网络应用程序上的平方根按钮都不适用于我的生活!编辑在分析时没有向我显示任何问题,所以我不知道问题是什么。你能看到我的代码中可能出现错误的地方吗?
这里'我的代码笔:https://codepen.io/IDCoder/full/zEBoOQ/
以下是HTML代码:
<DOCTYPE html>
<html>
<head>
<title>Ziontific Calculator</title>
<meta name="viewport" content="initial-scale=1">
</head>
<body>
<div class="container">
<h1 id="heading">ZIONTIFIC CALCULATOR</h1>
<div class="form holder">
<form id="formone" name="calc">
<input id="display" type="text" name="display" placeholder=".....get on board...." disabled contenteditable="false" >
<!--input type="text" placeholder="ExampleDomain"-->
<br>
<input class="button number one" type="button" value="1" onClick="calc.display.value+=1">
<input class="button number one" type="button" value="2" onClick="calc.display.value+=2">
<input class="button number one" type="button" value="3" onClick="calc.display.value+=3">
<input class="button three" type="button" value="C" onClick="Resetfunction(this.form)">
<input class="button three" type="button" value="<-" onClick="backspace(this.form)">
<input class="button three" type="button" value="=" onClick="evaluation(this.form)">
<input class="button number one" type="button" value="4" onClick="calc.display.value+=4">
<input class="button number one" type="button" value="5" onClick="calc.display.value+=5">
<input class="button number one" type="button" value="6" onClick="calc.display.value+=6">
<input class="button opps one" type="button" value="-" onClick="calc.display.value+='-'">
<input class="button opps one" type="button" value="%" onClick="calc.display.value+='%'">
<input class="button end one" type="button" value="cos" onClick="cos_function()">
<input class="button number two" type="button" value="7" onClick="calc.display.value+=7">
<input class="button number two" type="button" value="8" onClick="calc.display.value+=8">
<input class="button number two" type="button" value="9" onClick="calc.display.value+=9">
<input class="button opps two" type="button" value="*" onClick="calc.display.value+='*'">
<input class="button n" type="button" value="n!" onClick="fact_function()">
<input class="button sin"type="button" value="sin" onClick="sin_function()">
<input class="button opps two" type="button" value="." onClick="calc.display.value+='.'">
<input class="button number two" type="button" value="0" onClick="calc.display.value+=0">
<input class="button opps two" type="button" value="," onClick="calc.display.value+=','">
<input class="button opps two" type="button" value="+" onClick="calc.display.value+='+'">
<input class="button opps two" type="button" value="/" onClick="calc.display.value+='/'">
<input class="button end two" type="button" value="tan" onClick="tan_function()">
<input class="button third row" type="button" value="E" onClick="calc.display.value+=2.718">
<input class="button third row" type="button" value="pi" onClick="calc.display.value+=3.141">
<input class="button third row" type="button" value="x^y" onClick="power_function()">
<input class="button third row" type="button" value="(" onClick="openpara(this.value)">
<input class="button third row" type="button" value=")" onClick="closepara(this.value)">
<input class="button third row" type="button" value="log" onClick="log_function()">
<input class="button third row" type="button" value="sqrt" onClick="sqrt_function()">
<input class="button third row" type="button" value="LN2" onClick="calc.display.value+=0.693">
<input class="button third row" type="button" value="LN10" onClick="calc.display.value+=2.302">
<input class="button third row" type="button" value="log2E" onClick="calc.display.value+=1.442">
<input class="button third row" type="button" value="log10E" onClick="calc.display.value+=0.434">
<input class="button third row" type="button" value="EXP" onClick="exp_function">
</form>
</div>
</div>
</body>
</html>
以下是CSS代码:
{{ 2}}以下是JavaScript代码:
body{
text-align: center;
background-color;
}
h1{
color: white;
}
.container{
background-image: url(https://s26.postimg.org/frq6u3odl/texture-seamless-wood-3.jpg);
position: relative;
max-width: 550px;
padding: 10px;
height: auto;
margin: auto;
top: 0;
border: 0;
}
.form.holder{
max-width:500px;
height:auto;
margin: auto;
padding-bottom: 0;
background-color:black;
text-align:center;
border-radius:10px;
border:2px groove #333;
box-shadow:4px 4px 2px #666666;
overflow: hidden;
}
#formone{
padding-top:35px;
padding-bottom: 10px;
}
input, textarea {
-webkit-appearance: none;
-webkit-border-radius: 0;
}
input{
display: inline
font-size: 30px;
}
#display{
height:60px;
width:84.5%;
color: blue;
margin:3px;
border:2px inset black;
border-bottom:2px inset #FFF;
border-right:2px inset #FFF;
border-radius: 5px;
background-color:#c6c6c4;
font-size: 1.75em;
}
.button.end.one,.button.number.one,.button.three,.button.opps.one,.button.number.two,.button.opps.two,.button.n, .button.sin,.button.end.two,.button.third.row {
font-size: 20px;
transition: all 0.5s ease-in-out;
cursor: pointer;
border-radius: 5px;
border: none;
color: white;
width:12.5%;
height:60px;
margin: 3px;
}
.button.end.one{
background-color: #4CAF50;
}
.button.number.one{
background-color: #4CAF50;
}
.button.three{
background-color: #4CAF50;
}
.button.opps.one{
background-color: #4CAF50;
}
/*
.button.number.two{
background-color: #ffff00;
}
.button.opps.two{
background-color: #ffff00;
}
.button.n{
background-color: #ffff00;
}
.button.sin{
background-color: #ffff00;
}
.button.end.two{
background-color: #ffff00;
}
*/
.button.end.two, .button.sin, .button.n, .button.opps.two, .button.number.two {
background-color: #ffff00;
color: white;
text-shadow: 0 0 1px black;
}
.button.third.row{
background-color: #ef1a07;
}
@media only screen and (max-width: 450px) {
#heading{
font-size: 20px !important;
}
}
@media only screen and (max-width: 450px) {
.button.end.one,.button.number.one,.button.three,.button.opps.one,.button.number.two,.button.opps.two,.button.n, .button.sin,.button.end.two,.button.third.row{
font-size: 12px;
}
}
@media only screen and (max-width: 300px) {
.button.end.one,.button.number.one,.button.three,.button.opps.one,.button.number.two,.button.opps.two,.button.n, .button.sin,.button.end.two,.button.third.row{
font-size: 9px;
}
}
@media only screen and (max-width: 450px) { .button.end.one,.button.number.one,.button.three,.button.opps.one,.button.number.two,.button.opps.two,.button.n, .button.sin,.button.end.two,.button.third.row{
width:12%;
height:50px;
}
}
@media only screen and (max-width: 302px) {
#heading{
font-size: 15px !important;
}
}
@media only screen and (max-width: 302px) {
.form.holder{
height: 450px;
}
}
@media only screen and (max-width: 302px) { .button.end.one,.button.number.one,.button.three,.button.opps.one,.button.number.two,.button.opps.two,.button.n, .button.sin,.button.end.two,.button.third.row{
width:12%;
height:30px;
}
}
@media only screen and (max-width: 302px) {
.form.holder{
height: 325px;
}
}
答案 0 :(得分:0)
对于sqrt函数,缺少值:
function sqrt_function() {
flag += 1;
calc.display.value = Math.sqrt(calc.display.value);
}
对于百分比,它是javascript中的模数,我尝试了6%5,其中1为您的工具,这很好。 如果你想要百分比,你只需要除以100。
calc.display.value = calc.display.value / 100;
对于你的日志,你要连接值,我认为这是错误的:
calc.display.value+=1.442
对于你的指数,缺少()
<input class="button third row" type="button" value="EXP" onClick="exp_function()">
我猜这将有效
function exp_function() {
flag += 1;
calc.display.value = Math.exp(calc.display.value);
}
如果有帮助,请告诉我。