JavaScript (JS) tabIndex Example: HTML DOM Objects – Anchor Object – JavaScript (JS) tabIndex Example

Get 5 Hours of FREE PREMIUM Videos:

LearnVisualStudio.NET Free Preview


LearnVisualStudio.NET Free Preview: Declaring Variables and Assigning Values

I am a lifetime member of LearnVisualStudio.net and a Premium Plus member of dotNetVideos.net.

LearnVisualStudio.net is awesome because it grows in value each year as more videos are added.

dotNetVideos.net is also great because it focuses a lot on MS Certifications and practical interview questions.


- Wade Harvey (IdealProgrammer.com)

LearnVisualStudio Premium Videos

Visual C# 2010 for Absolute Beginners C# for Absolute Beginners C# for Absolute Beginners Study Guide Visual Basic for Absolute Beginners
Visual Basic Express Edition Study Guide Visual Basic 9.0 Language Enhancements Entity Framework Linq To Sql
Windows Phone 7 Development Unit Testing ASP.NET MVC 3 (In Progress) ASP.NET MVC Hands On Project
ASP.NET For Absolute Beginners Visual Web Developer C# Study Guide Visual Web Developer VB.NET Study Guide ASP.NET Controls Series
ASP.NET AJAX ASP.NET Architecture Series ASP.NET Server Controls Silverlight 4.0
Windows Presentation Foundation Windows Forms Controls Visual Studio 2010 New Features Visual Studio Team System 2008
Visual Studio Team System Features Getting Started With Sql Server Express Edition


dotNetVideos Premium Video Catalog

Interview Questions & Answers Windows AzureASP.NET MVC 4Windows Phone 7 (3 Videos)
Visual Studio 2011 Application Lifecycle ManagementLightSwitchHTML 5SOLID
Visual Studio Add-OnsVisual Studio 2010 ALM Lab ManagementASP.NET 4 Deep Dive Microsoft Enterprise Library 5 with ASP.NET 4 (10 Videos)
Virtualization Techniques for Developer (5 Videos)Test Series - 70-519: Designing and Developing Web Applications Using Microsoft .NET Framework 4 (20+ Videos)Test Series - 70-519: Supplemental
70-513: Test Series (MCTS) Windows Communication Foundation 4 (20+ Videos)70-515:Web Applications Development with Microsoft .NET Framework 4 (20+ Videos)Test Series - 70-516: Accessing Data with Microsoft .NET Framework 4 (20+ Videos)Test Series: 70-432: Microsoft SQL Server 2008, Implementation and Maintenance (20+ Videos)
Test Series: 70-433: SQL Server AdministrationFrom Novice To Professional - C# (25 Videos)From Novice To Professional - VB.NET (25 Videos)




Premium (Not Free) Video Tutorials

Free Video Tutorials & Free Tools

JavaScript (JS) tabIndex Example: HTML DOM Objects – Anchor Object – JavaScript (JS) tabIndex Example

Purpose: – Illustrates the for the .

View Other Anchor Object Properties and Methods

Prerequistes:

Syntax: object.tabIndex=Index – Allows you to retrieve or assign tabbing order for objects.

Restrictions: None

Notes:

  • You can build your own library of syntax examples by using same web site over and over and just add new files to it.

Instructions:

  1. Use Visual Web Developer 2008
  2. Create new web site;
    • Click File/New Web Site
    • Select ASP.NET Website Template
    • Select C-Sharp for hrefuage
    • name of Web Site could be JavaScript_Syntax.
  3. Folder

  4. Add New folder named "HTMLDOMObjects"
    • Right-click project name in solution explorer;
    • add new folder;
    • name of folder should be: HTMLDOMObjects
  5. Add New subfolder to "HTMLDOMObjects" folder named "DOMAnchor"
    • Right-click folder named "HTMLDOMObjects" in solution explorer;
    • add new folder;
    • name of folder should be: DOMAnchor
  6. Add New subfolder to "DOMAnchor" subfolder named "AnchorObjectProperties"
    • Right-click subfolder named "DOMAnchor" in solution explorer;
    • add new folder;
    • name of folder should be: AnchorObjectProperties
  7. Add HTML Page Named tabIndex to AnchorObjectProperties subfolder
    • Right-click AnchorObjectProperties subfolder;
    • add new item;
    • Select HTML Page
    • HTML Page name should be tabIndex
  8. Click on copy code in code below to copy code into HTML Page tabIndex.htm
  9. Right-click on HTML page tabIndex.htm and select view in browser
View Example In Browser

 HTML |  copy code |? 
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html>
  <head>
    <title>IdealProgrammer.com: tabIndex </title>
    <!-- 
    ***************************************************
    * This example is from http://idealprogrammer.com *
    ***************************************************
    -->
 
 
 
   </head>
  <body>
      <input id="Button1" type="button" tabindex="2" value="Button1" /><br /><br />
      <input id="Button2" type="button" tabindex="1" value="Button2" /><br /><br />
      <input id="Button3" type="button" tabindex="0" value="Button3" /><br /><br />
      <input id="Button4" type="button" tabindex="3" value="Button4" /><br /><br />
   <script type="text/javascript">
       //*****************************************************
       // DOM Objects
       //*****************************************************
 
 
       //*****************************************************
       //    ***    Anchor Object Properties   ***
       //*****************************************************
 
       //*****************************************************
       // tabIndex
       //*****************************************************
 
       //    SYNTAX:
       //    object.tabindex="index"  Allows you to retrieve or assign  
       //               the tabbing order for an object
 
       // Two ways to retrieve accessKey   
       //   1. GetElementsByTagName
       myObject = document.getElementsByTagName('input')[0];
       document.write("Button1  Using getElementsByTagName : " + myObject.tabIndex);
       document.write("<br />");
       //   2. GetElementById
       document.write("Button2  Using getElementById: ");
       document.write(document.getElementById('Button2').tabIndex);
 
       document.write("<br /><br />");
       // Two ways to assign accessKey
 
       //   1. GetElementById
       myThirdButton = document.getElementById('Button3');
       myThirdButton.tabIndex = "3";
       document.write("<br />Button3 tabIndex changed to 3: ", myThirdButton.tabIndex);
 
       //   2. GetElementsByTagName      
       myFourthButton = document.getElementsByTagName('input')[3];
       myFourthButton.tabIndex = "0";
       document.write("<br />Button4 tabIndex changed to 0: ", myFourthButton.tabIndex)
 
</script>
 
  </body>
</html>
 
 
 
 
 

Related posts:

  1. accessKey Example JavaScript (JS): HTML DOM Objects – Anchor Object: accessKey Example JavaScript (JS) accessKey Example JavaScript (JS): HTML DOM Objects - Anchor Object:...
  2. JavaScript (JS) id Example: HTML DOM Objects – Anchor Object – JavaScript (JS) id Example JavaScript (JS) id Example: HTML DOM Objects - Anchor Object...
  3. JavaScript (JS) name Example: HTML DOM Objects – Anchor Object – JavaScript (JS) name Example JavaScript (JS) name Example: HTML DOM Objects - Anchor Object...
  4. JavaScript (JS) href Example: HTML DOM Objects – Anchor Object – JavaScript (JS) href Example JavaScript (JS) href Example: HTML DOM Objects - Anchor Object...
  5. JavaScript (JS) innerHTML Example: HTML DOM Objects – Anchor Object – JavaScript (JS) innerHTML Example JavaScript (JS) innerHTML Example: HTML DOM Objects - Anchor Object...

Related posts brought to you by Yet Another Related Posts Plugin.

Speak Your Mind

Tell us what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!

Powered by WP Hashcash

This blog uses the cross-linker plugin developed by Web-Developers.Net