Friday, September 25, 2015

Leap Year Checker in Javascript

This sample program that I wrote using JavaScript as my programming language will check if the given year by the user is a leap year or not. Leap year occurs every four year just like we having our Olympic games held. I added a function to clear the text field and checking for invalid entry values. The code is very simple and easy to understand by people that are new in JavaScript programming.

If you  have some questions please send me an email at jake.r.pomperada@gmail.com and jakerpomperada@yahoo.com. My mobile number here in the Philippines is 09173084360.







Sample Program Output


Program Listing

<html>
<head>
<style>
body {
  background-color:lightgreen;
  font-family:arial;
  font-size:20px;
  color:blue;
  }
  label {
    float: left;
    width: 30%;
    text-align: left;
    margin-right: 1em;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}
.form-field-no-caption {
    margin-le

input[type="radio"]{
 float:left;
}
</style>
<meta charset="UTF-8">
<title> Leap Year Checker in JavaScript </title>

 <script type="text/javascript">

        function count_words() {
        var input = document.getElementById("userInput").value;
              var year  = parseInt(input);
               
               if (isNaN(year)) {
                  alert("Enter a valid year");
                   document.getElementById("result").innerHTML =  "";
                   document.getElementById("userInput").value="";
                   document.getElementById("userInput").focus();
                   }
                 else  if  ((year & 3) == 0 && ((year % 25) != 0 || (year & 15) == 0))
                {
                document.getElementById("result").innerHTML = 
                "The year " + year + " is a LEAP year";
                }
                else {
                  document.getElementById("result").innerHTML = 
                "The year " + year + " is NOT A LEAP year";
                 }
                
                 }
        
        function clear_textbox(){
          document.getElementById("result").innerHTML =  "";
          document.getElementById("userInput").value="";
          document.getElementById("userInput").focus();
         
        }
    </script>
</head>
<body>
<h2> Leap Year Checker in Javascript </h2>
Enter desired year
  <br>
    <input type="text"  id="userInput" size="4" maxlength="4" autofocus>
    <br><br>
    <input type="submit" value="Check" 
    title="Click here to check for leap year."
    onclick="count_words()" /> &nbsp; &nbsp; 
    <input type="submit" value="Clear" 
     title="Click here to clear the text box."
    onclick="clear_textbox()" />
<br><br><br>
  <p id="result"></h1>
</body>
</html>




No comments:

Post a Comment