#javascript #html #electron
#javascript #HTML #электрон
Вопрос:
Codepen:https://codepen.io/HasanTheSyrian_/pen/OJNNjyV
Это выполняется на Electron. Не включены предварительные условия для электронного рендеринга. По какой-то причине он по-прежнему выдает мне ошибку «Ожидаемое выражение аргумента» в VSC, HTML doc. Я много чего перепробовал, но по какой-то причине все еще выдает ту же ошибку.
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
Комментарии:
1. Эээ
insert(.)? Что это должно означать2. Боже мой. Я даже не шучу, я просто заметил, что забыл ‘ ‘ в тот момент, когда увидел ваш комментарий. «insert(‘.’)» работает просто отлично.
3. @AluanHaddad Возможно, вы могли бы опубликовать ответ, чтобы его можно было принять?
4. Я думаю, что это просто опечатка, поэтому на самом деле не стоит отвечать. Но спасибо
Ответ №1:
добавьте "insert('.')" по назначению