2015-11-29 60 views
-3

我有一个分配给写一个脚本,需要用户的出生月份,日和年。然后计算该人的年,月,日,小时和分钟数。也计算直到下一个生日的人数。我写了一个名为leapYear()的函数,它执行几个方程来检查年份是否为闰年并且工作正常,但如果我尝试在另一个函数内多次调用该函数,则会得到'Uncaught TypeError:闰年不是一种功能'。有人可以告诉我哪里出错了吗?的Javascript遗漏的类型错误:不是一个函数

提前致谢!

的index.html

<!DOCTYPE html> 
<html> 
<head> 
    <title>HTML 5 Template</title> 
    <meta charset="UTF-8" /> 
    <meta name="viewport" content="width=device-width,initial-scale=1.0" /> 
    <link rel="stylesheet" href="style.css" type="text/css" /> 
    <!-- USE ONLY IF using author's modernizr JavaScript file --> 
    <script type="text/javascript" src="modernizr.js"></script> 
    <!-- USE ONLY IF using external JavaScript file --> 
    <script type="text/javascript" src="functions.js"></script> 
    <script type="text/javascript"> 
     <!-- USE ONLY IF using document level JavaScript --> 
    </script> 
</head> 
<body> 

    <div id="form"> 
     <h1>Age Calculator</h1> 
     <h2>Enter Your Birthdate:</h2> 
     <form method="get" onsubmit="return false"> 
      <p> 
       <label for="day">Day:</label><br> 
       <select name="day" id="day"> 
        <script> dayList(); </script> 
       </select> 
      </p> 
      <p> 
       <label for = "month">Month:</label><br> 
        <select name="month" id="month"> 
         <option value="1">January</option> 
         <option value="2">February</option> 
         <option value="3">March</option> 
         <option value="4">April</option> 
         <option value="5">May</option> 
         <option value="6">June</option> 
         <option value="7">July</option> 
         <option value="8">August</option> 
         <option value="9">September</option> 
         <option value="10">October</option> 
         <option value="11">November</option> 
         <option value="12">December</option> 
        </select> 
       </p> 
       <p> 
        <label for="year">Year:</label><br> 
        <select name="year" id="year"> 
         <script> yearList();</script> 
        </select> 
       </p> 
       <p class="left"> 
        <input type="submit" value="Calculate" onclick="ageCalc()"> 
        <input type="reset" value="Reset"> 
       </p> 
     </form> 
    </div> 

    <div id="results"> 
     <p> 
      You've been living for: <br> 
      <p id="yearsLived"></p> Years, <br> 
      <p id="monthsLived"></p> Months, <br> 
      <p id="daysLived"></p> Days, <br> 
      <p id="hoursLived"></p> Hours, and <br> 
      <p id="minLived"></p> Minutes. <br> 
      <p id="daysTillBD"></p> Days till your birthday. 
     </p> 
    </div> 
</body> 
</html> 

functions.js

//Global Variables 
var date = new Date(); 
var currentMin = date.getMinutes(); 
var currentHour = date.getHours(); 
var currentDay = date.getDate(); 
var currentMonth = date.getMonth() + 1; 
var currentYear = date.getFullYear(); 
var month = { 
    1: 31, 
    2: 28, 
    3: 31, 
    4: 30, 
    5: 31, 
    6: 30, 
    7: 31, 
    8: 31, 
    9: 30, 
    10: 31, 
    11: 30, 
    12: 31 
}; 



//Fill Day Form Data 
function dayList() { 
    var counter = 1; 
    while (counter <= 31) { 
    document.write("<option value='" + counter + "'>" + counter + "</option>"); 
    var counter = counter + 1; 
    } 
}; 



//Fill Year Form Data 
function yearList() { 
    var counter = date.getFullYear(); 

    while (counter >= 1950) { 
    document.write("<option value='" + counter + "'>" + counter + "</option>"); 
    var counter = counter - 1; 
    } 
}; 



//Check if birth year is leap year 
function leapYear(birthYear) { 
    var num = (birthYear/4) % 1; 
    var num2 = (birthYear/100) % 1; 
    var num3 = (birthYear/400) % 1; 

    if (num == 0 || (num2 == 0 && num3 == 0)) { 
    daysInYear = 366; 
    month[2] = 29; 
    leapYear = true; 
    } 
    else { 
    daysInYear = 365; 
    month[2] = 28; 
    leapYear = false; 
    } 
}; 



//Age Calculator 
function ageCalc() { 
    var birthDay = parseInt(document.getElementById('day').value); 
    var birthMonth = parseInt(document.getElementById('month').value); 
    var birthYear = parseInt(document.getElementById('year').value); 
    var yearsLived = currentYear - birthYear; 
    var monthsLived = 0; 
    var daysLived = 0; 
    var hoursLived = currentHour; 
    var minLived = currentMin; 
    var daysTillBD = 0; 
    var count = 0; 

    //Days Untill birthday 
    leapYear(currentYear); 
    if (birthMonth < currentMonth) { 
    daysTillBD = month[currentMonth] - currentDay; 
    var testMonth = currentMonth; 
    while (testMonth != 12) { 
     testMonth++; 
     daysTillBD = daysTillBD + month[testMonth]; 
    } 
    var testYear = currentYear + 1; 
    leapYear(testYear); 
    testMonth = 1; 
    while (testMonth != birthMonth) { 
     daysTillBD = daysTillBD + month[testMonth]; 
     testMonth++; 
    } 
    daysTillBD = daysTillBD + (birthDay - 1); 
    } 
    else if (birthMonth > currentMonth) { 
    daysTillBD = month[currentMonth] - currentDay; 
    var testMonth = currentMonth + 1; 
    while (testMonth != birthMonth) { 
     daysTillBD = daysTillBD + month[testMonth]; 
     testMonth++; 
    } 
    daysTillBD = daysTillBD + (birthDay - 1); 
    } 
    else { 
    if (birthDay < currentDay) { 
     daysTillBD = month[currentMonth] - currentDay; 
     var testMonth = currentMonth + 1; 
     while (testMonth != birthMonth && testMonth <= 12) { 
     daysTillBD = daysTillBD + month[testMonth]; 
     testMonth++; 
     } 
     var testMonth = 1; 
     while (testMonth != birthMonth) { 
     daysTillBD = daysTillBD + month[testMonth]; 
     testMonth++; 
     } 
     daysTillBD = daysTillBD + (birthDay - 1); 
    } 
    else if (birthDay > currentDay) { 
     daysTillBD = birthDay - currentDay; 
    } 
    } 




    //Results Display 
    document.getElementById('yearsLived').innerHTML = yearsLived; 
    document.getElementById('monthsLived').innerHTML = monthsLived; 
    document.getElementById('daysLived').innerHTML = daysLived; 
    document.getElementById('hoursLived').innerHTML = hoursLived; 
    document.getElementById('minLived').innerHTML = minLived; 
    document.getElementById('daysTillBD').innerHTML = daysTillBD; 

}; 

的style.css

h1 { 
    font-size: 80px; 
    color: blue; 
    text-align: center; 
} 

h2 { 
    font-size 50px; 
    text-indent: 150px; 
} 

form { 
    margin: auto; 
    width: 80%; 
} 

#form { 
    width: 50%; 
    height: 600px; 
    margin: auto; 
    border: 5px black double; 
} 

#form.p { 
    width: 33%; 
    text-align: center; 
    float: left; 
    margin: 0, auto; 
} 

#form.p.left { 
    float: right; 
} 

#results { 

} 

#results.p { 

} 
+0

请提供更多的细节。错误发生在哪条线上?函数调用? –

+0

请阅读如何创建[mcve]并相应地编辑您的问题。 –

回答

1

有几件事情,你做的不对。

首先,请记住,在JavaScript中,如果你不喜欢这种分配:

leapYear = true; 

你写进去叫leapYear一个全球变量,而不是到绑定到当前函数的作用域的变量。要写入到一个局部变量,你应该在同一功能可按内的这种行之后写

var leapYear = true; 

所有的作业和引用到leapYear将写入到一个局部变量,而不是成为一个全球性的。

其次,请记住,在JavaScript功能可以类似地存储到一个变量为整数或字符串。所以,当你写function leapYear时,你声明了一个存储函数的变量leapYear。当你写leapYear = true时,你覆盖该变量,而不是它存储一个布尔值。如果再尝试拨打leapYear()你会得到错误,因为现在leapYear存储布尔值,而不是一个函数,布尔是不可调用的。

因此,要解决你的问题,你可以在前面加上leapYear = falsevar。但是,在您的具体情况中,您可以删除leapYear = falseleapYear = true行,因为您以后不会使用这些值。最后一点:如果你的目的是为了返回这个值,你应该写return false;,而不是leapYear = false;(这将返回在Delphi中值,例如以正确的方式)。

+0

谢谢!我没有意识到函数名称和变量在哪里如此接近。我觉得很愚蠢,因为我已经把leapYear = true/false变量放在项目的开头,然后决定反对它,但忽略从函数本身中删除它。 – user5491517

0

你有问题,为什么你的代码中包含具有相同名称(leapYear)去变量e funcion。更改变量ou函数的名称并运行新的测试后。

看看这个例子:

h1 { 
 
    font-size: 15px; 
 
    color: blue; 
 
    text-align: center; 
 
} 
 
h2 { 
 
    font-size 10px; 
 
    text-indent: 150px; 
 
} 
 
form { 
 
    margin: auto; 
 
    width: 80%; 
 
} 
 
#form { 
 
    width: 50%; 
 
    height: 250px; 
 
    margin: auto; 
 
    border: 5px black double; 
 
} 
 
#form.p { 
 
    width: 33%; 
 
    text-align: center; 
 
    float: left; 
 
    margin: 0, auto; 
 
} 
 
#form.p.left { 
 
    float: right; 
 
} 
 

 
#results {}
<script> 
 
    //Global Variables 
 
    var date = new Date(); 
 
    var currentMin = date.getMinutes(); 
 
    var currentHour = date.getHours(); 
 
    var currentDay = date.getDate(); 
 
    var currentMonth = date.getMonth() + 1; 
 
    var currentYear = date.getFullYear(); 
 
    var month = { 
 
     1: 31, 
 
     2: 28, 
 
     3: 31, 
 
     4: 30, 
 
     5: 31, 
 
     6: 30, 
 
     7: 31, 
 
     8: 31, 
 
     9: 30, 
 
     10: 31, 
 
     11: 30, 
 
     12: 31 
 
    }; 
 

 
    //Fill Day Form Data 
 
    function dayList() { 
 
     var counter = 1; 
 
     while (counter <= 31) { 
 
      document.write("<option value='" + counter + "'>" + counter + "</option>"); 
 
      var counter = counter + 1; 
 
     } 
 
    }; 
 

 
    //Fill Year Form Data 
 
    function yearList() { 
 
     var counter = date.getFullYear(); 
 
     
 
     while (counter >= 1950) { 
 
      document.write("<option value='" + counter + "'>" + counter + "</option>"); 
 
      var counter = counter - 1; 
 
     } 
 
    }; 
 

 
    //Check if birth year is leap year 
 
    function leapYearCalc(birthYear) { 
 
     var num = (birthYear/4) % 1; 
 
     var num2 = (birthYear/100) % 1; 
 
     var num3 = (birthYear/400) % 1; 
 
     
 
     if (num == 0 || (num2 == 0 && num3 == 0)) { 
 
      daysInYear = 366; 
 
      month[2] = 29; 
 
      leapYear = true; 
 
     } else { 
 
      daysInYear = 365; 
 
      month[2] = 28; 
 
      leapYear = false; 
 
     } 
 
    }; 
 

 
    //Age Calculator 
 
    function ageCalc() { 
 
     var birthDay = parseInt(document.getElementById('day').value); 
 
     var birthMonth = parseInt(document.getElementById('month').value); 
 
     var birthYear = parseInt(document.getElementById('year').value); 
 
     var yearsLived = currentYear - birthYear; 
 
     var monthsLived = 0; 
 
     var daysLived = 0; 
 
     var hoursLived = currentHour; 
 
     var minLived = currentMin; 
 
     var daysTillBD = 0; 
 
     var count = 0; 
 
     
 
     //Days Untill birthday 
 
     leapYearCalc(currentYear); 
 
     if (birthMonth < currentMonth) { 
 
      daysTillBD = month[currentMonth] - currentDay; 
 
      var testMonth = currentMonth; 
 
      while (testMonth != 12) { 
 
       testMonth++; 
 
       daysTillBD = daysTillBD + month[testMonth]; 
 
      } 
 
      var testYear = currentYear + 1; 
 
      leapYearCalc(testYear); 
 
      testMonth = 1; 
 
      while (testMonth != birthMonth) { 
 
       daysTillBD = daysTillBD + month[testMonth]; 
 
       testMonth++; 
 
      } 
 
      daysTillBD = daysTillBD + (birthDay - 1); 
 
     } else if (birthMonth > currentMonth) { 
 
      daysTillBD = month[currentMonth] - currentDay; 
 
      var testMonth = currentMonth + 1; 
 
      while (testMonth != birthMonth) { 
 
       daysTillBD = daysTillBD + month[testMonth]; 
 
       testMonth++; 
 
      } 
 
      daysTillBD = daysTillBD + (birthDay - 1); 
 
     } else { 
 
      if (birthDay < currentDay) { 
 
       daysTillBD = month[currentMonth] - currentDay; 
 
       var testMonth = currentMonth + 1; 
 
       while (testMonth != birthMonth && testMonth <= 12) { 
 
        daysTillBD = daysTillBD + month[testMonth]; 
 
        testMonth++; 
 
       } 
 
       var testMonth = 1; 
 
       while (testMonth != birthMonth) { 
 
        daysTillBD = daysTillBD + month[testMonth]; 
 
        testMonth++; 
 
       } 
 
       daysTillBD = daysTillBD + (birthDay - 1); 
 
      } else if (birthDay > currentDay) { 
 
       daysTillBD = birthDay - currentDay; 
 
      } 
 
     } 
 
     
 
     //Results Display 
 
     document.getElementById('yearsLived').innerHTML = yearsLived; 
 
     document.getElementById('monthsLived').innerHTML = monthsLived; 
 
     document.getElementById('daysLived').innerHTML = daysLived; 
 
     document.getElementById('hoursLived').innerHTML = hoursLived; 
 
     document.getElementById('minLived').innerHTML = minLived; 
 
     document.getElementById('daysTillBD').innerHTML = daysTillBD; 
 
    }; 
 
</script> 
 
<div id="form"> 
 
    <h1>Age Calculator</h1> 
 
    
 
    <form method="get" onsubmit="return false"> 
 
     <p> 
 
      <label for="day">Day:</label> 
 
      <br> 
 
      <select name="day" id="day"> 
 
       <script> 
 
       dayList(); 
 
       </script> 
 
      </select> 
 
     </p> 
 
     <p> 
 
      <label for="month">Month:</label> 
 
      <br> 
 
      <select name="month" id="month"> 
 
       <option value="1">January</option> 
 
       <option value="2">February</option> 
 
       <option value="3">March</option> 
 
       <option value="4">April</option> 
 
       <option value="5">May</option> 
 
       <option value="6">June</option> 
 
       <option value="7">July</option> 
 
       <option value="8">August</option> 
 
       <option value="9">September</option> 
 
       <option value="10">October</option> 
 
       <option value="11">November</option> 
 
       <option value="12">December</option> 
 
      </select> 
 
     </p> 
 
     <p> 
 
      <label for="year">Year:</label> 
 
      <br> 
 
      <select name="year" id="year"> 
 
       <script> 
 
       yearList(); 
 
       </script> 
 
      </select> 
 
     </p> 
 
     <p class="left"> 
 
      <input type="button" value="Calculate" onclick="ageCalc()"> 
 
      <input type="reset" value="Reset"> 
 
     </p> 
 
    </form> 
 
</div> 
 

 
<div id="results"> 
 
    <p> 
 
     You've been living for: 
 
     <br> 
 
     <p id="yearsLived"></p>Years, 
 
     <br> 
 
     <p id="monthsLived"></p>Months, 
 
     <br> 
 
     <p id="daysLived"></p>Days, 
 
     <br> 
 
     <p id="hoursLived"></p>Hours, and 
 
     <br> 
 
     <p id="minLived"></p>Minutes. 
 
     <br> 
 
     <p id="daysTillBD"></p>Days till your birthday. 
 
    </p> 
 
</div>

相关问题