Input 5 numbers, and show the largest/smallest

@draterFeb 28.2008

[CODE] <?xml version = “1.0”?> <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”> <!– Your name: James –> <!– Date: February 27, 2008 –> <!– Description: Chapter 7 – JavaScript: Introduction to Scripting – Exercise 7.26 – Page 207 – Homework Assignment – February 27, 2008 –>

<html xmlns=”http://www.w3.org/1999/xhtml” xml:lang=”en” lang=”en”>

<head> <title> Chapter 7 – JavaScript: Introduction to Scripting – Exercise 7.26 – Page 207 – Homework Assignment – February 27, 2008</title> <meta http-equiv=”content-type” content=”text/html;charset=utf-8″ /> <meta http-equiv=”Content-Style-Type” content=”text/css” />

<script language=”javascript” type=”text/javascript”> <!– var number1, // first number as an integer number2, // second number as an integer number3, // third number as an integer number4, // fourth number as an integer number5, // fifth number as an integer largest, // largest value among number1, number2, number3 , number4, and number5 smallest; // smallest value among number1, number2, number3 , number4, and number5

largest = smallest = number1 = window.prompt(“Please input first number”, 0); number2 = window.prompt(“Please input second number”, 0); number3 = window.prompt(“Please input third number”, 0); number4 = window.prompt(“Please input fourth number”, 0); number5 = window.prompt(“Please input fifth number”, 0);

//largest value among number1, number2, number3 , number4, and number5 if ( number2 > largest ) largest = number2;

if (number3 > largest) largest = number3;

if (number4 > largest) largest = number4;

if (number5 > largest) largest = number5;

//smallest value among number1, number2, number3 , number4, and number5 if (number2 < smallest) smallest = number2;

if (number3 < smallest) smallest = number3;

if (number4 < smallest) smallest = number4;

if (number5 < smallest) smallest = number5;

//Display the results document.write(“The smallest number among ” + number1 + “, ” + number2 + “, ” + number3 + “, ” + number4 + “, and ” + number5 + ” is ” + smallest + “<br />”); document.write(“The largest number among ” + number1 + “, ” + number2 + “, ” + number3 + “, ” + number4 + “, and ” + number5 + ” is ” + largest + “<br />”); // –> </script> </head> <body> <p>Click refresh to reload JavaScript</p> </body> </html>

[/CODE]

For some reason that will not give me any popup input box. I have absolutely no idea what I am doing wrong. If someone could help me find my error, I would be very appreciative.

to post a comment

JavaScript

5 Comments(s) _↴

@scragarFeb 28.2008 — #document.write() would never work with XHTML anyway.

[code=html]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
 <html>
 <head>
 <title>asking about homework huh?</title>
 <meta http-equiv="content-type" 
 content="text/html;charset=utf-8">
 <script type="text/javascript">
 /* <![CDATA[ */
 
 function addEvent(elementObject, eventName, functionObject){
 if(document.addEventListener){
 elementObject.addEventListener(eventName, functionObject, false);
 }else if(document.attachEvent){
 elementObject.attachEvent("on" + eventName, functionObject);
 };
 };
 
 function findVals(){
 var x = document.getElementsByTagName("input");
 var n = new Array();
 for(var i = 0; i < 5; i++)
 n[i] = parseInt('0'+x[i].value, 10);
 n = n.sort();
 x[5].value = n[4];
 x[6].value = n[0];
 };
 
 window.onload = function(){
 var x = document.getElementsByTagName("input");
 for(var i = 0; i < x.length; i++){
 addEvent(x[i], "change", findVals);// covers most instances.
 addEvent(x[i], "keydown", findVals);
 addEvent(x[i], "keyup", findVals);
 addEvent(x[i], "keypress", findVals);
 };
 };
 
 /* ]]> */
 </script>
 <style type='text/css'>
 input{
 width: 4em;
 }
 </style>
 </head><body>
 <form action='#'>
 <p>Numbers:</p>
 <p><input type='text' value='0'><input type='text' value='0'><input type='text' value='0'><input type='text' value='0'><input type='text' value='0'></p>
 <p>Max: <input type='text' value='0'></p>
 <p>Min: <input type='text' value='0'></p>
 
 </form>
 </body>
 </html>[/code]

EDIT: removed the extra / making the HTML invalid ?

EDIT 2: prevented NAN error on input's

@draterauthorFeb 28.2008 — #Uhhh yeah that's a bit too advanced for this class.

I changed:

<script language="javascript" type="text/javascript"> to

<script type="text/javascript">

and the website still doesn't run correctly.

The only thing that happens is 'Click refresh to reload JavaScript' is printed on the page. No popup message dialog box at all.

@scragarFeb 28.2008 — #as I said, document.write would never work(or atleast shouldn't, some browsers do for compatability, but avoid it if you can once you start learning more techniques) with XHTML, so your only option is to use HTML, or adopt an onload function to assign text(and also, since your document.write-ing into the head your gonna get very unpredicable results cross-browser).

That established your either going to have to resort to one of 2 techniques, either put your javascript in the head(NOT RECOMENDED), or as I showed use a few text boxes.

fix all your new lines in your code:

 largest,		// largest value among number1, number2, number3
 , number4, and number5

to:
largest, // largest value among number1, number2, number3, number4, and number5and so on.

@draterauthorFeb 28.2008 — #It works now. Why does comment length matter? it did not move the comment to the next row in notepad, but did on this forum.

@Declan1991Feb 28.2008 — #It works now. Why does comment length matter? it did not move the comment to the next row in notepad, but did on this forum.[/QUOTE]
He probably thought that you had inserted the new line, which would finish the comment, because when you make a comment with //, it runs to the first new line n.

Also in #JavaScript _↴

Javascript in FireFox?How to get new value in textbox in keypress event handler Changing Text on the Fly Using Javascript

Success!

Help @drater spread the word by sharing this article on Twitter...

Tweet This

Input 5 numbers, and show the largest/smallest

5 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Input 5 numbers, and show the largest/smallest

5 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

5 Comments(s) _↴

Also in #JavaScript _↴