1
當我按下按鈕的一切正常,但按下輸入它的觸發功能,並在我的瀏覽器快速返回,在snippest它desapiar。我嘗試了幾種方式時按回車鍵,但我得到同樣的問題,觸發按鈕 當觸發器輸入時執行速度快並返回?
function calculate() {
var response = document.getElementById("text").value;
if (response ==0 || response =="" || response >100 || response < 0) {
alert('you should write a 0<number<100');
} else{
var start = new Date();
var date = start.getFullYear();
var result = date - response;
x.innerHTML = 'Your Birth is '+ result;
document.getElementById('ma').style.color = 'lightpink';
document.getElementById('ma').style.fontFamily = 'sans-serif';
document.getElementById('ma').style.fontSize = "45px";
} ;
};
var x= document.getElementById('ma');
document.getElementById("button").onclick = function(){calculate();};
body {
outline: none;
}
h1 {
font-family: fresca;
outline: none;
font-size: 35px;
color:cornflowerblue;
}
form {
margin-top: 20em;
outline: none;
}
#text{
width: 35em;
height: 3em;
padding-left: 20px;
border-radius: 5px;
outline: none;
}
#text:focus {
background: lightblue;
}
#button{
width: 80;
height: 3em;
text-align: center;
border-radius: 10px;
border-style: none;
background: lightblue;
outline: none;
}
#button:hover {
background: lightgreen;
}
<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css">
<link href="https://fonts.googleapis.com/css?family=Fresca" rel="stylesheet">
</head>
<body>
<center>
<form>
<input type="text" placeholder="Your Age" id="text" onkeypress="Javascript: if (event.keyCode==13) calculate();" >
<input type="button" id="button" value="Calculate">
</form>
<h1 id="ma" >Manaf</h1>
</center>
<script src="script.js";></script>
<script
src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous"></script>
</body>
</html>