Drop-down box. Objectives Learn the HTML syntax of a drop-down list javascript properties of a list/menu: length options selectedIndex The location sub-object.

Slides:



Advertisements
Similar presentations
Working with Forms. how are forms manipulated? the document object contains an array of forms objects, one for each form, in document order –forms[] any.
Advertisements

Sue Wills July Objects The JavaScript language is completely centered around objects, and because of this, it is known as an Object Oriented Programming.
JavaScript and the DOM Les Carr COMP3001 Les Carr COMP3001.
1 Lesson 10 Using JavaScript with Styles HTML and JavaScript BASICS, 4 th Edition Barksdale / Turner.
JavaScript Forms Form Validation Cookies. What JavaScript can do  Control document appearance and content  Control the browser  Interact with user.
Copyright 2007, Information Builders. Slide 1 Implementing On-Click Functionality With the HTML Layout Painter Larry J Braun Education Specialist June,
JavaScript Forms Form Validation Cookies CGI Programs.
Web-based Application Development Lecture 17 March 16, 2006 Anita Raja.
20-Jun-15 JavaScript and HTML Simple Event Handling.
Frames An overview. Why frames Frames allow you to show several documents in one page. Useful for navigation. Useful for attaching pages from other sites.
CST JavaScript Validating Form Data with JavaScript.
HTML Links and Anchors.
CNIT 133 Interactive Web Pags – JavaScript and AJAX JavaScript forms.
JS: DOM Form Form Object Form Object –The Form object represents an HTML form. –For each instance of a tag in an HTML document, a Form object is created.
CNIT 133 Interactive Web Pags – JavaScript and AJAX Event and Event Handling.
Chapter 5 Java Script And Forms JavaScript, Third Edition.
Programming Games Review for midterm. Work session. Homework: Prepare for midterm.
WEEK 3 AND 4 USING CLIENT-SIDE SCRIPTS TO ENHANCE WEB APPLICATIONS.
JavaScript II ECT 270 Robin Burke. Outline JavaScript review Processing Syntax Events and event handling Form validation.
DOM and JavaScript Aryo Pinandito.
DHTML: Dynamic HTML Internet Technology1. What is DHTML? A collection of enhancements to HTML ► To create dynamic and interactive websites Combination.
CSS Class 7 Add JavaScript to your page Add event handlers Validate a form Open a new window Hide and show elements Swap images Debug JavaScript.
Integrating JavaScript and HTML5 HTML5 & CSS 7 th Edition.
Linking web pages Wah Yan College (Hong Kong) Mr. Li C.P.
INTRODUCTION TO JAVASCRIPT AND DOM Internet Engineering Spring 2012.
JavaScript. Overview Introduction: JavaScript basics Expressions and types Expressions and types Arrays Arrays Objects and Associative Arrays Objects.
Using Client-Side Scripts to Enhance Web Applications 1.
Introduction to JavaScript 41 Introduction to Programming the WWW I CMSC Winter 2004 Lecture 17.
JavaScript, Fourth Edition Chapter 5 Validating Form Data with JavaScript.
Copyright 2007, Information Builders. Slide 1 Understanding Basic HTML Amanda Regan Technical Director June, 2008.
Tutorial 5 Windows and Frames Section B - Working with Frames and Other Objects Go to Other Objects.
Chapter 5: Windows and Frames
Intro to JavaScript Scripting language –ECMAScript compliant –Client side vs. server side Syntactic rules –White space –Statement end: ; optional –Comments:
DOM Animation Changing the DOM objects over time.
Handling Image & Animation Using JavaScript HTML tag to display image: More options:
JavaScript, Fourth Edition Chapter 4 Manipulating the Browser Object Model.
The Web Wizard’s Guide To JavaScript Chapter 3 Working with Forms.
Chapter 19 Creating and Processing HTML Forms. How HTML Forms Transmit Data name1=value1&name2=value2...&nameN =valueN GET or POST GET, an HTTP GET request,
Chapter 6 Links. 3 Parts of Links 1. Destination: defines what happens when a user clicks the link. 2. Label: this is the text (or possibly an image)
1 CSC160 Chapter 7: Events and Event Handlers. 2 Outline Event and event handlers onClick event handler onMouseOver event handler onMouseOut event handler.
Event Handling. Objectives Using event handlers Simulating events Using event-related methods.
WDMD 170 – UW Stevens Point 1 WDMD 170 Internet Languages eLesson: Variables, Functions and Events (NON-Audio version) © Dr. David C. Gibbs WDMD.
COS 125 DAY 20. Agenda Assignment 8 not corrected yet Assignment 9 posted  Due April 16 New course time line Discussion on Scripts 
OBJECTS What is an Object? Definition Properties Methods Events.
Web Programming Java Script & jQuery Web Programming.
HTML FORMS The TEXT Object Presented By: Ankit Gupta.
5 th and 4 th ed: some from chapters 9, 12, 13 SY306 Web and Databases for Cyber Operations Slide Set #8: Dynamic HTML.
LESSON : EVENTS AND FORM VALIDATION -JAVASCRIPT. EVENTS CLICK.
Introduction to JavaScript MIS 3502, Spring 2016 Jeremy Shafer Department of MIS Fox School of Business Temple University 2/2/2016.
20-753: Fundamentals of Web Programming 1 Lecture 13: Javascript II Fundamentals of Web Programming Lecture 13: Javascript II.
HTML Tutorial. What is HTML HTML is a markup language for describing web documents (web pages) HTML documents are described by HTML tags Each HTML tag.
COM621: Advanced Interactive Web Development Lecture 6 – JavaScript (cont.)
SE-2840 Dr. Mark L. Hornick 1 Dynamic HTML Handling events from DOM objects.
Understanding Objects. value Example: txtFirstName. The dot notation is the key that opens the door to the house. Properties room Methods room Events.
Chapter 4 Java Script – Part2. 2 Location object Properties Properties href – whole path will be displayed. ex: window.location.href ( see example 11)
Introduction to JavaScript MIS 3502, Fall 2016 Jeremy Shafer Department of MIS Fox School of Business Temple University 9/29/2016.
Week-12 (Lecture-1) Cascading Style Sheets (CSS): describe how documents are presented on screens. Types of Style Sheets: External Style Sheet - Define.
LINKS.
العدد تذكيره وتأنيثه مقدمة
DHTML Javascript Internet Technology.
Basic HTML and Embed Codes
FORM OBJECT When creating an interactive web site for the Internet it is necessary to capture user input and process this input. Based on the result of.
DHTML Javascript Internet Technology.
© 2015, Mike Murach & Associates, Inc.
Pertemuan 1b
Graphics Considerations
Murach's JavaScript and jQuery (3rd Ed.)
Murach's JavaScript and jQuery (3rd Ed.)
Murach's JavaScript and jQuery (3rd Ed.)
Presentation transcript:

Drop-down box

Objectives Learn the HTML syntax of a drop-down list javascript properties of a list/menu: length options selectedIndex The location sub-object of document The href property of location

HTML syntax option 1 option 2

Javascript properties To access the select element: document.form1.menu Properties of the element: length options (an array) options[n].value options[n].text selectedIndex Event-handlers: onchange / onfocus /onblur

Example Links Google Facebook

Example function go(){ var n = document.form1.links.selectedIndex; var url = document.form1.links.options[n].value; window.document.location.href = url; }

Assignment Modify the example by targeting the value of the options to the src attribute of an iframe. (5 points) The html code for the iframe is:

Feedback: Privacy Policy Feedback
Do Not Sell My Personal Information
About project: SlidePlayer Terms of Service

© 2025 SlidePlayer.com. Inc. All rights reserved.