In the following example, a timer function is designed. The user need to provide input of timer function, as the timer proceeds, the color of progress bar is changing. <html> <head> <title></title> <script language="javascript" type="text/javascript"> var id = null; function myStartFunction(totalTime) { var txtbox = document.getElementById("txtbox"); var mytable = document.getElementById("mytable"); var width = 0; id
Breadcrumb is a dynamic navigation bar that usually is shown at top of page telling user on which page the user is currently on. The breadcrumb helps a user to track his/her current location on the website as well as to navigate to the previous pages. Here is a javascript code to create a breadcrumb:
What is the difference between calling objects of Select, Listbox, Radiobutton array, and checkboxes array in javascript ============================ If you have Select, it will be accessed in javascript like this: var country = document.getElementById(“ddlcountry”);… if( country.selectedIndex == 0) { alert(“Country must be selected”); return false; } To retrieve values and text of select, we use
In the following program, the user inputs his/her marks in a text box. The GPA is computed and shown in other box index.html <!DOCTYPE html> <html> <head> <title>Untitled document</title> <meta charset="utf-8" /> <script language="javascript" type="text/javascript"> function calculategpa() { var marks = document.getElementById("txtmarks").value; var gpa = document.getElementById("txtgpa"); if(marks >= 50 && marks <= 60) { gpa.value
We can dynamically insert/delete text boxes in a web page. To do so, we can put text boxes (or any other form element) into a table and dynamically delete the rows of table (or add new rows in table). <html> <head> <script language="javascript" type="text/javascript"> function Delete() { document.getElementById("myTable").deleteRow(0); } </script> </head> <body> <table id="myTable"
When we create a popup using javascript, we can provide a list of options to customize the appearance of popup window. In the following files, a popup is created. In the popup window, user is provided with options to input values. When the user clicks on close button on popup, the values are written on
If the javascript functions are defined in the same file where they are used, it will increase the code of file and many javascript functions will not be reusable in other files. So it is recommended to put the javascript code in a separate file and call that file in html document (just like we
By default browsers does not allow us to disable back button. However, when working with database applications, we often need to disable the back button. In this example, we disable the back button using javascript: <html> <head></head> <body> <h1>This is page 1</h1> <br><br> <input id="btnback" name="btnback" type="button" value="Back" onclick="window.history.back();" /> </body> </html>
In this code script, we access the status bar using javascript. The status bar shows URLs and text when mouse is move over the hyperlinks. The status bar is present at bottom left of page. <html> <head> <title></title> <script language="javascript" type="text/javascript"> function statusBarText() { window.status = "This is text"; document.write(window.status); } </script> </head> <body onload="statusBarText();">
