HTML
  Home arrow HTML arrow Page 3 - Function Details for a Web Page Calculator
Dev Articles Forums 
ADO.NET  
Apache  
ASP  
ASP.NET  
C#  
C++  
ColdFusion  
COM/COM+  
Delphi-Kylix  
Design Usability  
Development Cycles  
DHTML  
Embedded Tools  
Flash  
Graphic Design  
HTML  
IIS  
Interviews  
Java  
JavaScript  
MySQL  
Oracle  
Photoshop  
PHP  
Reviews  
Ruby-on-Rails  
SQL  
SQL Server  
Style Sheets  
VB.Net  
Visual Basic  
Web Authoring  
Web Services  
Web Standards  
XML  
Mobile Linux 
App Generation ROI 
IBM® developerWorks 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us Get Paid 
Request Media Kit
Contact Us 
Site Map 
Privacy Policy 
Support 
 USERNAME
 
 PASSWORD
 
 
  >>> SIGN UP!  
  Lost Password? 
HTML

Function Details for a Web Page Calculator
By: Chrysanthus Forcha
  • Search For More Articles!
  • Disclaimer
  • Author Terms
  • Rating: 4 stars4 stars4 stars4 stars4 stars / 2
    2009-03-18

    Table of Contents:
  • Function Details for a Web Page Calculator
  • First Segment continued
  • The Second Code Segment
  • Second Code Segment continued
  • The Third Code Segment

  • Rate this Article: Poor Best 
      ADD THIS ARTICLE TO:
      Del.ici.ous Digg
      Blink Simpy
      Google Spurl
      Y! MyWeb Furl
    Email Me Similar Content When Posted
    Add Developer Shed Article Feed To Your Site
    Email Article To Friend
    Print Version Of Article
    PDF Version Of Article
     
     
    ADVERTISEMENT


    Function Details for a Web Page Calculator - The Second Code Segment


    (Page 3 of 5 )

    The second code segment is a switch statement. Each case in the switch statement corresponds to a digit button, the +/- button, the decimal point button or the RM button. The first case is:


    case "B0":

    valueAlreadyThere = document.getElementById('CI1').value;

    valueAlreadyThere+="0";

    if (!(/^00/.test(valueAlreadyThere)))

    document.getElementById('CI1').value = valueAlreadyThere;

    break;


    Clicking the zero digit button corresponds to this case. When any digit button is clicked, the digit joins any number that was already on the display, to the right. So the first line here gets any number that was on the display into the local variable string, named valueAlreadyThere. The second line adds the character zero to the variable.

    Next, we have an “if” statement. We do not want any number beginning with more than one zero. So the “if” statement verifies, using the regular expression technique, whether the content of the variable which is to go to the display is “00.” If it is, it allows only one zero on the display. If it is not, it means zero will be added to the digit or number that was on the display. The “if” statement does this by writing the content of the valueAlreadyThere string variable back to the display.


    The second case is:


    case "B1":

    valueAlreadyThere = document.getElementById('CI1').value;

    valueAlreadyThere+="1";

    document.getElementById('CI1').value = valueAlreadyThere;

    break;

    case "B2":


    This case corresponds to the digit button of 1. The first line reads the content of the display and assigns it to the valueAlreadyThere string local variable. The character 1 is appended to the string content of valueAlreadyThere in the second line. The last line writes the content of valueAlreadyThere to the display. In this way, one is added to the right of any number that was on the display. If there was no number on the display, 1 becomes the only number on the display.

    The next case in our second code segment is:


    case "B2":

    valueAlreadyThere = document.getElementById('CI1').value;

    valueAlreadyThere+="2";

    document.getElementById('CI1').value = valueAlreadyThere;

    break;


    This case corresponds to the digit button of 2. The explanation is similar to the previous case.

    More HTML Articles
    More By Chrysanthus Forcha


     

    HTML ARTICLES

    - Google Font API: Requesting a Bold Font Styl...
    - Google Font API: Using the Bi Shorthand
    - Working with the Google Font API`s bolditali...
    - Displaying Bold Text with the Google Font AP...
    - Using the Google Font API`s Bold Argument
    - The Google Font API`s i Shorthand
    - Using the Google Font API`s Italic Option wi...
    - Using the Google Font API`s Italic Option
    - The Google Font API: an Introduction
    - Using HTML 5`s Mark, Summary and Details Ele...
    - Embedding External Content with HTML 5`s Art...
    - Building Sidebars with HTML 5`s Aside Element
    - Working with HTML 5`s Footer Element
    - Using the HTML 5 Section Element
    - An Introduction to HTML 5: Doctype, Header a...







    © 2003-2010 by Developer Shed. All rights reserved. DS Cluster 8 Hosted by Hostway
    For more Enterprise Application Development news, visit eWeek