Как взять значение input-а не в строчный тип,а в числовой для калькулятора чтобы прибавить два значения
$('document').ready(function(){
$('button').on('click',function(){
var a,b,c,d;
a=$('#val1').val();
b=$('#val2').val();
alert(a+b);
});
});
body{
background-color: #333;
padding:5px;
margin:5px;
}
div{
margin:10px;
padding:10px;
border-color: white;
}
input{
margin:5px;
padding: 5px;
}
b{
color:white;
margin:7px;
padding: 7px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Mypracticetest</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<div align="center">
<b>Калькулятор</b><br>
<input type="number" name="" id="val1"><br/>
<input type="number" name="" id="val2"><br/>
<button>Ответ</button>
</div>
</body>
</html>
Ответы (1 шт):
Автор решения: CbIPoK2513
→ Ссылка
Из инпута вы получаете всегда строку, по этому её нужно "перевести" в "число"
$('button').on('click', function() {
var a, b, c, d;
a = Number($('#val1').val());
b = Number($('#val2').val());
alert(a + b);
});
body {
background-color: #333;
padding: 5px;
margin: 5px;
}
div {
margin: 10px;
padding: 10px;
border-color: white;
}
input {
margin: 5px;
padding: 5px;
}
b {
color: white;
margin: 7px;
padding: 7px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div align="center">
<b>Калькулятор</b><br>
<input type="number" name="" id="val1"><br/>
<input type="number" name="" id="val2"><br/>
<button>Ответ</button>
</div>
Либо используйте eval()
$('button').on('click', function() {
var a, b, c, d;
a = $('#val1').val();
b = $('#val2').val();
alert(eval(a+'+'+b));
});
body {
background-color: #333;
padding: 5px;
margin: 5px;
}
div {
margin: 10px;
padding: 10px;
border-color: white;
}
input {
margin: 5px;
padding: 5px;
}
b {
color: white;
margin: 7px;
padding: 7px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div align="center">
<b>Калькулятор</b><br>
<input type="number" name="" id="val1"><br/>
<input type="number" name="" id="val2"><br/>
<button>Ответ</button>
</div>