Download presentation
Presentation is loading. Please wait.
Published byRolf Cook Modified over 9 years ago
1
Forms and Java script
2
Forms The graphical user interface -textbox, radio, button, textarea, checkbox… The processing script –CGI scripts, Perl script, PHP
3
Creating a form
4
Please share any suggestions or comments with us: Comments?
5
Creating a form The field with the NAME attribute equal to comments had a VALUE equal to Comments? This is my comments The field with the NAME attribute equal to submit had a VALUE equal to Order Bed
6
Creating an email form Please share any suggestions or comments with us: Comments?
7
Creating GUI component Textbox: Radio button King Queen
8
Creating GUI component Creating checkboxes Foodboard Drawers
9
Adding hidden field to a form Why do we need hidden fields? –To keep the status of the program –To transfer data between different forms
10
Java scripts Two types of scripts: –Automatically executed –Event-driven
11
Automatic script Example: Adding date and time to the web site
12
Automatic script time.js: document.write(" "+Date()+" ")
13
Alert box
14
Code <input type="button" value="Open Alert Box" onClick='alert("Welcome to our first alert box. Press OK to contine.")'>
15
Practice 1.Open Textpad and cut & paste this code Java script page /title> And save it as script.html
16
Practice 2. Insert HTML and Java script code to : - set up a simple form, as shown below. If a user clicks on “Send comments” button, the comment should be sent to your email address - add an alert box
17
Creating a button that Executes a script
18
Code What time is it?
19
Changing an Image when a visitor points
22
Code "Have you ever been in Wisconsin?". See the beautiful picture, please point to it to see how long it will last.
23
Controlling a New Windows’s size An FBI agent must go undercover in the Miss United States beauty pageant to prevent a group from bombing the event. Sandra Bullock
24
Variables in java script String: “How are you”: a series of characters inside quote marks Number: 4,5: any number not inside quote marks Boolean: true/false Null: null Create a variable: var myVar = 45 var myString=“How are you”
25
If/then statement if (condition) { statement[s] if true } If (condition) { statement if true } else { statement if false }
26
Repeat loops for ([init expression];[condition];[update expression]) { statements inside loop } Example: for (var i=startValue; i< maxValue; i++) { statements inside loop }
27
Function function functionName([parameters]) { statements }
28
Example
29
Code var newWindow function makeNewWindow() { newWindow = window.open("","","HEIGHT=300,WIDTH=300") } function closeNewWindow() { if (newWindow) { newWindow.close() }
30
Code
31
Practice 1.Open Textpad and cut & paste this code Java script page /title> And save it as script.html
32
Practice 2. Use google search engine to download 3 pictures (let’s call them pic1, pic2 and pic3). Insert HTML and Javascript code so that: - Pic1 is displayed in the middle of the screen. If a user moves his mouse over pic1, pic2 will be displayed there instead. If the user moves the mouse out of pic2, pic3 will be displayed there instead. 3. Adding date and time to your web page
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.