个人中心
gpt4 book ai didi

javascript - 无法在文本框中添加小数

转载 作者：行者123 更新时间：2023-12-03 12:22:15 25 4
gpt4 key购买 nike

Codepen:https://codepen.io/HasanTheSyrian_/pen/OJNNjyV
这是在Electron上运行的。不包括Electron Renderer先决条件。
由于某种原因，它仍然给我VSC，HTML文档中的错误“期望参数表达式”。我尝试了很多事情，但由于某种原因仍然给我相同的错误。
index.html

<html>
  <head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="index.css">
    <script src="index.js"></script>
  </head>
  <body>

    <tittle>
      <h1><em>Hasan's Super Ultimate Extra Cool Calculator Of Destruction</em></h1>
      </tittle>
      
      <div class="main">
      <form name="form"> <input name="textview" type="text" class="textview"> </form>
      </div>

      <p>
      <div class="containerOne">
              <button><div class="btn buttonC" onclick="clean()">      C </div></button>
              <button><div class="btn buttonPlus" onclick="insert('+')">   + </div></button>
              <button><div class="btn buttonMinus" onclick="insert('-')">  - </div></button>
              <button><div class="btn buttonX" onclick="insert('*')">      X </div></button>
              
                 <button><div class="btn buttonSeven" onclick="insert(7)"> 7 </div></button>
                 <button><div class="btn buttonEight" onclick="insert(8)"> 8 </div></button>
                 <button><div class="btn buttonNine" onclick="insert(9)">  9 </div></button>
                 <button><div class="btn buttonDiv" onclick="insert('/')">   / </div></button>
                 
                    <button><div class="btn buttonFour" onclick="insert(4)">   4 </div></button>
                    <button><div class="btn buttonFive" onclick="insert(5)">   5 </div></button>
                    <button><div class="btn buttonSix" onclick="insert(6)">    6 </div></button>
                    <button><div class="btn buttonEquals" onclick="equal()"> = </div></button> 
      
                       <button><div class="btn buttonOne" onclick="insert(1)">   1 </div></button>
                       <button><div class="btn buttonTwo" onclick="insert(2)">   2 </div></button>
                       <button><div class="btn buttonThree" onclick="insert(3)"> 3 </div></button>
                       <button> <div class="btn buttonZero" onclick="insert(0)">  0 </div></button> 

                        <button> <div class="btn buttonPi" onclick="insert(3.14)">  𝜋 </div></button>
                        <button> <div class="btn buttonPi" onclick="insert(.)">  . </div></button> 
              
      </div>
      </p>
  </body>
</html>
index.css 
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  margin: auto;
  max-width: 38rem;
  padding: 2rem;
  background-color: #298fca; 
}

h1 {

padding: 20px;
font-size: 25px;
text-align: center;
color:rgb(255, 255, 255);
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.textview {

user-select: none; /* This removes text-highlight form behind the numbers */
font-family: Impact;
justify-content: center;
display: block;
text-align: center;
opacity: 0.3;
margin: 0 auto;
border: 0px;
height: 30px;
width: 208px;
font-size: 20px;
}

.containerOne { /* This contains all buttons */

margin: 0 auto;
max-width: 216px;
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: center;
align-items: center;
}

button { /* The backside of the button/button itself */

border-radius: 22px;
height: 50px;
width: 50px;
border: none;
font-size: 30px;
justify-content: center;
margin: 2px;
color: white;
background-color: #5ba4cf;
}

.btn { /* The frontside of the button */
 
  user-select: none; /* This makes the user unable to select/highlight the text inside the calculator buttons */
  font-family: Impact;
  position: center;  
  flex: 1 1 auto;
  text-align: center;
  text-transform: uppercase;
  transition: 1s; /* How long the animation will take to fully execute */
  background-size: 500% auto;
  color: rgb(214, 214, 214); /* Color of the numbers/text inside the buttons */   
  text-shadow: 0.5px 0.5px 2px black;
  border-radius: 20px;    
}

.buttonC {

  background-image: linear-gradient(to right, #69cee0 0%, #298fca 100%);

}

.buttonPlus {

  background-image: linear-gradient(to right, #69cee0 0%, #298fca 100%);

}

.buttonMinus {

  background-image: linear-gradient(to right, #69cee0 0%, #298fca 100%);

}

.buttonX {

  background-image: linear-gradient(to right, #69cee0 0%, #298fca 100%);

}

.buttonDiv {

  background-image: linear-gradient(to right, #69cee0 0%, #298fca 100%);

}

.buttonPi {

  background-image: linear-gradient(to right, #69cee0 0%, #298fca 100%);

}

.buttonEquals {

  background-image: linear-gradient(to right, #69cee0 0%, #298fca 100%);

}

.buttonSeven {

  background-image: linear-gradient(to right, #298fca 0%, #69cee0 100%);

}

.buttonEight {

  background-image: linear-gradient(to right, #298fca 0%, #69cee0 100%);

}

.buttonNine {

  background-image: linear-gradient(to right, #298fca 0%, #69cee0 100%);

}

.buttonFour {

  background-image: linear-gradient(to right, #298fca 0%, #69cee0 100%);

}

.buttonFive {

  background-image: linear-gradient(to right, #298fca 0%, #69cee0 100%);

}

.buttonSix {

  background-image: linear-gradient(to right, #298fca 0%, #69cee0 100%);
  
}

.buttonOne {

  background-image: linear-gradient(to right, #298fca 0%, #69cee0 100%);

}

.buttonTwo {

  background-image: linear-gradient(to right, #298fca 0%, #69cee0 100%);

}

.buttonThree {

  background-image: linear-gradient(to right, #298fca 0%, #69cee0 100%);

}

.buttonZero {

  background-image: linear-gradient(to right, #298fca 0%, #69cee0 100%);

}

.btn:hover {
  cursor: pointer;
  background-position: center right;
}

button:active,
button:focus {
  outline: none;  
}

.textview:focus,
.textview:active {
  outline: none;
}

index.js 

function insert(num){ // Calculator functions

  document.form.textview.value = document.form.textview.value+num
}
function equal(){
  var exp = document.form.textview.value
  if(exp){
      document.form.textview.value = eval(exp)
  }
}
function clean(){
  document.form.textview.value = ""

}
function back(){
  var exp = document.form.textview.value
  document.form.textview.value = exp.substring(0,exp.length-1)
}

//
function decimal(){
  
  document.form.textview.value = document.form.textview.value+num.toFixed(2);
  
} // Here

最佳答案

根据需要添加"insert('.')"

关于javascript - 无法在文本框中添加小数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/63425624/

25 4 0
文章推荐： reactjs - 属性 'setUser'在 'Readonly<{}> & Readonly<{ children?: ReactNode; }>'类型上不存在
文章推荐： javascript - Electron:如何防止 Cmd + Q 退出？
文章推荐： node.js - 在 Node.js/Electron 应用程序中使用 iTunes 库框架？
文章推荐： javascript - Electron 上传进度
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com