我正在尝试使用秒表来显示人们每工作 x 次获得多少报酬。我无法让用户输入他们的薪水,然后将这个数字传递给脚本。结果我不断得到NaN。它易于使用“提示”功能,但我更喜欢页面上的一些输入。
<html>
<head>
<style>
body {
background: #0e415f;
min-width:800px;
max-width:2400px;
font-family: Omnes, Myriad Pro, arial, Helvetica;
color: #f1a400;}
.header {
width: 800px;
margin: 0 auto;}
.clock {
border: 3px solid #f1a400 double;
border-radius: 10px;
border-style: double;
width: 600px;
margin: 20 auto;
font-size: 10em;
text-align:center;}
.money {
border: 3px solid #f1a400 double;
border-radius: 10px;
border-style: double;
width: 600px;
margin: 20 auto;
font-size: 10em;
text-align:center;}
.buttons {
width: 350px;
margin: 20 auto;}
.button_style{
height:50px;
width:100px;
font-size:20px;
margin: 0 .3em;
background: #f1a400;
border-radius: 10px;
border: 0;}
</style>
<script type="text/javascript">
function getSalary()
{
var salaryAm = document.getElementById("salaries");
var salary = salaryAm.value;}
var seconds=-1.0; /* To start clock at 0 seconds */
var min=0;
var time;
var secPay = Number(salary)/(52*40*60*60); /* Weeks * Hours * Minutes * Seconds */
var timerPay = 0;
function timer(){
seconds++;
if(seconds>59){
min++;
document.getElementById("mins").innerHTML=padTimer(min);
seconds=0;}
document.getElementById("secs").innerHTML=padTimer(seconds);
document.getElementById("money").innerHTML=parseFloat(secPay*timerPay++).toFixed(2);
};
function padTimer(x) {
if (x<=9) { x = ("0"+x); }
return x;}
function start(){
time=setInterval(timer, 1000);
timer;}
function pause() {
clearInterval(time);
seconds--;
timerPay--;};
function reset(){
seconds=-1.0;
timerPay=0;
time=0;
if (min !=0){
min=0;}};
</script>
</head>
<body>
<input id="salaries" type="text">
<div class="header"><img src="breakcalc.png"></div>
<div class="clock">
<span id="mins" >00</span>:<span id="secs">00</span><br>
</div>
<div class="money">
<span>$ </span><span id="money">0.00</span>
</div>
<div class="buttons">
<a href="#" id="button" onclick="start()" ondblclick="return false;"><button class="button_style">Start</button></a>
<a href="#" id="button" onclick="pause()"><button class="button_style">Stop</button></a>
<a href="#" id="button" onclick="reset()"><button class="button_style">Reset</button></a>
</div>
</body>
</html>