
Page /> 1 | 2 | 3
Basics:
Now lets get into how this is done. I am going to go over each line in order to give you a full understanding of what exactly is being done. The html file has 2 javascript functions in it as you can see, the generate_page and the round_total functions.
The generate page function is the actual function that is called when the submit button is pressed, which later calls the round_total function, which rounds the value of the mathematical calculations to a number with only 2 digits (ex. 2.0333 turns into 2.03). I am going to skip the first couple of lines that contain the most basic html (if you need help on explaining what each is and does then please check the html section of this website), and get right to the javascript.
<script language="JavaScript"> purpose is to tell the client (usually browser) that the javascript code is begining, and then is later closed off by </script> in line 40.
After that, in order to hide from older versions of clients that do not support javascript we add the line <!-- (comment tag, anything between the start and the end of it will be ignored, in most cases), this line must be closed off with the --> (line 39).
Now we start the actual javascript code. JavaScript allows comments just as html does with <!-- -->, it allows c-style comments (multi-line), delimited by /* and */ and also one line comments started with //. I've included the use of both types of comments in this small example in lines 7-8, 16, 18, and 37.
How it's done:
Now we come to the start of function round_total. "function round_total (c) {" marks the beginning of the function round_total with the variable "c" as the arguement (the arguements are passed to the function when the function is called, which creates an easy and efficient way to save code by putting similar methods into one function).
The first line (10) of function round_total defines "pennies" a variable as c multiplied by 100 (we use the "var" in order to make sure that this variable is not global and can only be accessed from this function). Line 11 calls an internal js function in the object Math called round with the arguement the variable "pennies", "pennies" in turn will be set to the return value of Math.round (a number rounded to the nearest integer).
Finally we declare "strPennies" as a local variable and we set its value to "" (empty string) and the value of variable "pennies". We had to do this because the variable "pennies" right now contains an integer not a string. So, what this will do is create a string with the integer, which we had to do in order to call the next .length and .substring on the "strPennies" object (same as String object, can be written as "var strPennies = new String("" + pennies)").
On line 13 we set the local variable "len" to the number of characters in the "strPennies" variable by calling the .length method on the String object. Now comes the final line before we "close" the function round_total. The first thing we write on line 14 is "return" which will return a value of the function (for example, if it was called with "mycount = round_total(c)" and we put "return 1" inside the function, then the value of "mycount" would be set to 1), one thing to remember about return is that all code after it will not be run but will be processed for errors.
I will start to explain what exactly the function is going to be returning from the inside and work my way out.
<< Previous Page | Next Page >>