Errata

JavaScript & jQuery: The Missing Manual

Errata for JavaScript & jQuery: The Missing Manual

Submit your own errata for this product.

The errata list is a list of errors and their corrections that were found after the product was released.

The following errata were submitted by our customers and have not yet been approved or disproved by the author or editor. They solely represent the opinion of the customer.

Color Key: Serious technical mistake Minor technical mistake Language or formatting error Typo Question Note Update

Version Location Description Submitted by Date submitted
Printed Page pg. 122
paragraph 6 of JQuery Versions

There is no longer a Current_Release Anchor on the http://docs.jquery.com/Downloading_jquery page.

Anonymous  Jan 29, 2014 
Printed United States

on page 330 step 7 title
After the code you added in line 6 type:

s/b
After the code you added in step 6 type:

Roy Canterbury  Aug 01, 2014 
Other Digital Version prompt.html

<div class"wrapper"> missing from line 13 of prompt.html file of tutorial files.

Samuel Roberts  Jan 22, 2016 
Other Digital Version iztd6nh4
Morocco

http://doxycycline-online.us/ - doxycycline online http://zoloft-2016.top/ - zoloft http://buyamoxil.club/ - amoxil http://priceofviagra.us/ - click http://mobic75.date/ - mobic 50 mg

asressspfxpy  Dec 11, 2016 
Other Digital Version mmza6vs8
Morocco

http://nexium-40mg.trade/ - nexium 40 mg price http://citalopram-hydrobromide.science/ - read this http://nolvadex.pro/ - visit this link http://buy-strattera.site/ - strattera http://generic-wellbutrin.party/ - wellbutrin http://buyaugmentin.site/ - buy augmentin http://phenergan6.top/ - phenergan

asressxzuw82  Dec 12, 2016 
Printed Page File Name js3e-master\js3e-master\chapter01\Hello.html
Line 8

The point of the html is that nothing on the page gets rendered until the page's "Alert" on line 8 is responded to. In javascript "alert" is case sensitive. Since "alert" is spelled "Alert" instead of "alert" the browser simply ignores the line and everything gets rendered immediately (there is no "This page says" + Environment.NewLine + "Hello world!").

This might not seem like much but when you are starting out is very confusing and it took me a couple of wasted hours to figure out the problem.

Scott Thompson  Mar 09, 2023 
Other Digital Version soure code
All the alerts in the source, at least in chapter01 are spelle incorrectly

All of the alert calls which are supposed to hold up the rendering of the page until answered are spelled Alert. This function call is case-sensitive and this incorrect spelling causes the Alert to simply be ignored and the page rendered immediately. Doesn't sound like much but when you are new trying to get thing to work it is very frustrating.

Scott Thompson  Mar 13, 2023 
Printed Page 34
Point 7

The code in the book is different than the one in the completed code example for "complete fadein"


The example in the book shows 1.6.3 - that does not work.
The example in the completed file "completefadein" is 1.7.2 - that code works and makes webpage fade in.

Brian Ostertag  Jan 09, 2019 
Printed Page 44
Last paragraph in FAQ 'Putting Quotes into Strings'

You can even escape quote marks when you don't necessarily have to. For example: 'He said, "Hello"'

The example should be: 'He said, \"Hello\"'

Tom Van Hauwaert  Nov 09, 2013 
Printed Page 44
Frequently asked Question paragraph 5

On page 44 in the "FREQUENTLY ASKED QUESTION", paragraph 5 it says:

You can even escape quote marks when you don't necessarily have to--as a way to make it clear that the quote mark should be taken literally. For example. 'He said, "Hello."'

When it should be:

For example. 'He said, /"Hello./"'

Anonymous  Jan 16, 2014 
Printed Page 63
lines 2 and 3 from bottom of paragraph 1

The book says:
"You can also supply an equation that returns a valid number. In this case, days.length - 1 is a short equation: it first retrieves the number of items in the days array (that's 7 in this example) and subtracts 1 from it."

days.length - 1 is not an equation. An equation needs an equals sign and something on both sides of the equals sign. This is an expression that returns a value. This is consistent with the last line of the paragraph: "So, in this case, days[days.length -1] translates to days[6]."

In both cases, the word 'equation' should be replaced by the word 'expression'.

Barry Gruber  Dec 22, 2013 
Printed Page 72
2nd paragraph

In the second paragraph it states:

"...if you create a variable named data that stores an array, then store a number in the variable, you've changed that variable's type from an array to a number object:"

The following code snippet then shows:

"var data = false; // an boolean object
data = 32; // changes to a number object"

I would suggest therefore that in the paragraph preceding the code snippet "array" should be replaced with "boolean"

Rich Murrills  Feb 06, 2015 
Printed Page 92
Bullit 9

The print first says
luckyNumber = parseInt(luckyNumber, 10);

and when bullit 10 appears the same line is now
luckyNumber = parseInt(luckyNumber); [i.e. without the ", 10"]

What does the ", 10" do? Both versions works for me....

Jesper Br?sted  Mar 30, 2014 
Printed Page 121
Item 2 at top of page

The link http://docs.jquery.com/Downloading_jquery is available, but the "Current Release" link is not, and there is not Current Release headline. In the middle of the page there is the notation: "This is somewhat embarrassing, isn?t it? It seems we can?t find what you?re looking for." Most likely this will not be a problem, because the file is supplied with the examples for the book from sawmac.com/j2se, but I thought you should know.

Paul Verger  May 06, 2014 
Printed Page 140
2nd line from bottom of page

Line reads as follows:
$('#product101').replaceWith(<p>Added to cart</p>');

There should be single quotes encasing the contents of the replaceWith() function, however there is no quote mark preceding the opening paragraph tag.

Corrected line reads as follows:
$('#product101').replaceWith('<p>Added to cart</p>');

Michael Rosata  Dec 11, 2013 
Printed Page 147
3rd paragraph under "Action on Each Element in a Selection", first line

"For example, say you want to list of all of the external links..." should perhaps read "For example, say you want a list of all of the external links..." or it could also be written "For example, say you want to list all of the external links..."

John Rose  Aug 21, 2015 
Printed Page 153
United States

on page 153 paragraph 7 line 1 you reference a different jquery library that the rest of the example
the line has

<script src="../_js/jquery-1.6.2.min.js"></script>

and it should have

<script src="../_js/jquery-1.7.2.min.js"></script>

Roy Canterbury  Jul 17, 2014 
Printed Page 178
2nd paragrah

The code does not work. I tried many things and the only way it woks if I create a function inside the binding function and not outside:

$('#button1').bind('click', {
message1 : 'I am a button '
}, function(evt) {
alert(evt.data.message1);

Ionara Wilson  Aug 22, 2013 
Printed Page 183
United States

In the example for faq.html taken from the chapter down loads you specify adding on page 183 example 8. line 7
$(this).next('.answer').fadeIn();

and in the chapter 5 solution
completed_faq.html has that line as

$(this).next('.answer').slideDown();

they both do basically the same thing but the solution doesn't match the book

they both add the text but in different ways.

Roy Canterbury  Jul 17, 2014 
Printed Page 192
United States

On page 192, it is suggested that the toggle() event be used for applying two different effects at once. But as mentioned in the errata on pg 173, the toggle() event is no longer used in version 1.9+. I have fooled around with it but I haven't been able to make this part of the tutorial work with the newer version. Can you list how this would be done without the toggle() event?

Anonymous  Mar 13, 2014 
Printed Page 194
2nd paragraph, "Note"

1. Animating the CSS shorthand border-width with jQuery works (jQuery API documentation at https://api.jquery.com/animate/).
If you want to animate the rendered border width, at least a border style and border width other than "auto" must be set in advance.

For example:
<style>
#element {
border-style: solid;
border-width: 1px;
};
</style>
$('#element').animate(
{
'border-width': '20px'
}, 1000 );

2. Furthermore, the text on the second to last line in the note refers to border properties "border-width-left" "border-width-top". This should be "border-left-width" and "border-top-width".

3. The code example will not work because of incorrect properties and missing quotes around their values that contain units (px).

Incorrect:
$('#element').animate(
{
borderTop: 20px,
borderRight: 20px,
borderBottom: 20px,
borderLeft: 20px
}, 1000 );

Correct:
$('#element').animate(
{
borderTopWidth: '20px',
borderRightWidth: '20px',
borderBottomWidth: '20px',
borderLeftWidth: '20px'
}, 1000 );

Balthazar  Mar 28, 2014 
Printed Page 197
Between code lines #2 and #3

The following code is nearly complete:

$('#photo').width(0).height(0).css('opacity',0);
$('#caption').hide();
$('#photo').animate(

{

width: '400px',
height: '300px',
opacity: 1

},
1000,
function() {
$('#caption').fadeIn(1000);
}
); // end animate
});

To see how this code works, the text cites the file "callback.html" from the course tutorial files for Chapter 6 - it is supposed to contain the same code, but has the click function noted below:

$('#photo').width(0).height(0).css('opacity',0);
$('#caption').hide();
$('html').click(function() { // click initiates animate
$('#photo').animate(
{
width: '400px',
height: '300px',
opacity: 1
},
1000,
function() {
$('#caption').fadeIn(1000);
}
); // end animate
}); // end click

Without this line of code, the page will not wait for the click function to display the photo. Instead, it displays it immediately during the page load.

David Omahen  Feb 26, 2014 
Printed Page 200
1. Section

The book has the correct typing, but the file that is downloaded references a newer jQuery version.
<script src="../_js/jquery-1.7.2.min.js"></script>
Fatal error when using this extension with the code in the book. To make the code work you need to change the external JavaScript file back to version 1.6.3. Please make this correction on the download link.

Kevin  Aug 06, 2013 
ePub Page 203
step 12

chapter06 animation

stopping the animation does not work on Firefox browser (version 27). when hovering dashboard div slides in and immediately out. this problem occurs on complete_animate.html tutorial file also. no problem on other browsers (I tested on chrome). Firefox bug?

Anonymous  Feb 28, 2014 
Printed Page 210
1st para

1 var preloadImages = ['images/roll.png',
2 'images/flower.png',
3 'images/cat.jpg'];
4 var imgs = [];
5 for (var i=0; i<preloadImages.length;i++) {
6 imgs[i] = new Image();
7 imgs[i].src = preloadImages[i];
8 }

This example of using an array for preloading images, provides no clue as to how to use the newly created image object in an event, such as the rollover programme described in the subsequent tutorial, beginning on page 213. The tutorial uses a totally different method for preloading the images but when one tries to use the above method imgs[I] won't work as the source in the first hover function as outlined below. Could do with some extra explanation on this please.

<script>
$(document).ready(function() {
$('#gallery img').each(function() {
var imgFile = $(this).attr('src');
var preloadImages = ['../_images/small/blue_h.jpg',
'../_images/small/green_h.jpg',
'../_images/small/orange_h.jpg',
'../_images/small/purple_h.jpg',
'../_images/small/red_h.jpg',
'../_images/small/yellow_h.jpg'];
var imgs = [];
for (var i = 0; i < preloadImages.length; i++) {
imgs[i] = new Image();
imgs[i].src = preloadImages[i];
}
$(this).hover(
function() {
$(this).attr('src', imgs[i].src);
},
function() {
$(this).attr('src', imgFile);
}
); // end hover
}) // end each
});// end ready
</script>

John Gill  Oct 26, 2013 
Printed Page 214
Step 5 - boldface instruction

Line reads "...add the following two lines of code:"
However, three lines of code follow.
The line should read "add the following three lines of code:"

Anonymous  Nov 19, 2013 
Printed Page 214
United States

on page 214 step 5
title line has
"following two lines of code"

but show three lines

it should read "following three lines of code"

Roy Canterbury  Jul 18, 2014 
Printed Page 215
United States

Page 215 step 7
"In the empty line (line 9 in step 6)"
should be
"In the empty line (line 10 in step 6)"

Roy Canterbury  Jul 18, 2014 
Printed Page 237
last line on page

The last sentence ends with "... one of jQuery's other show effects (see page 189)."

Page 189 discusses absolute positioning with CSS. Page 187 discusses the show effects.

"(see page 189)" should be replaced with "(see page 187)",

Barry Gruber  Dec 30, 2013 
Printed Page 239
last code example

There is something going on in the last code example that I think could use some elaboration. The code has the following second line:

$('a[href^="http://"]').not('[href^=" ' +myURL+ ' "]').attr('target', '_blank');

and this code works. But what is unclear is the need to add ' +myURL+ ' to the variable that is created in the first line of the example, myURL, which is a string that contains the protocol and host name. If it is a string, why does one need to surround it with '+? The preceding selector in the statement only has [href^="http;//"]. Of course this is an explicit string whereas myURL is a string variable, but explaining what conversion is going on would be a good thing.

Anonymous  Jul 18, 2014 
Printed Page 248
Step 2

Page 248, Step 2
For the file , in-page-links.html, I do not see "Search Google" text. The first link that I see has text "Smashing Magazine".

Maybe fixing errata caused errata. Now, maybe fixing tutorial files is easier.

Bruce  Aug 26, 2013 
Printed Page 250-251
United States

All nested <li> tags are missing 'class="stack"' which goes with the explanations listed on page 253.

Tyler  Aug 05, 2014 
Printed Page 265
Within code for .focus() form event

There is a small but significant typo within the .focus() source code that caused me to spend near an hour trying to figure out why the code wouldn't work, until I did a quick Google search and learned the reason.

Line 3:

if (field.val()==field.attr('defaultValue')) {

Should be:

if (field.val()==field.prop('defaultValue)){


Attributes exist within HTML source code, properties such as 'defaultValue' exist within the DOM (Document Object Model)

Anonymous  Mar 09, 2015 
Printed Page 279
2nd line

Currently: ...you can simply access the FORM's value property."

Recommended change: "...you can simply access the form ELEMENT's value property. "

Minor issue, but could be confusing--especially if a reader is already struggling a bit.

Catherine  Apr 27, 2014 
Printed, PDF Page 299
Top of page

I found a writing error at the top of page 299: "The function receives both the error message and the form element the error applies to, so you can use a conditional statement (page 79) to check whether the form field is either a radio button of a checkbox."

The "of" in the last line needs to be replaced with an "or."

Dave  Mar 26, 2014 
Printed, PDF Page 334
Last paragraph

The last paragraph has an error in this sentence:

"(you calculate the bottom of the trigger by finding its top positon?
triggerPos.right?and add its height?triggerH)."

"triggerPos.right" should be "triggerPos.top"

Dave  Apr 19, 2014 
Other Digital Version 353
"The programming"

KIndle version
The tutorial does not seem to be the correct one. I believe it should be the load.html example, and it is actually login.html

Anonymous  Mar 17, 2014 
Printed Page 354
in item number 3.

... "type var url=$(this). <newline> attr('href');

The dot after "$(this)" looks like an end-of-sentence-period.

I would either force a newline before the entire section of code, or at least before that final period. The period needs to be in with the .attr bit.

David Patterson  Nov 17, 2014 
Printed Page 355
Step 6

You should let people know that, with default settings, this cannot be tested in the latest versions of Google Chrome or Safari (Firefox is okay), nor can any load() command using local files. You will see the following error in the console: "XMLHttpRequest cannot load [local file] Received an invalid response. Origin 'null' is therefore not allowed access." There are various ways to circumvent this [setting up a local server, etc.] but you should perhaps have a little infobox about it.

Anonymous  May 29, 2014 
Printed Page 356
3rd line

+ ' .newsItem'

should be:

+ ' #newsItem'

Johan ter Beek  Dec 24, 2014 
Printed Page 360
ist para

var data = $.post('rankMovie.php',
{
rating: 5,
user: Bob
}
}; // end post

I think this should simply read as follows:

$.post('rankMovie.php',
{
rating: 5,
user: Bob
}
}; // end post

john Gill  Nov 07, 2013 
Printed Page 368
Section 9 last para.

Firstly,
The result as described here will not happen until you have added 'return false; as described at section 11, line 15 on page 370. Without the 'return false' statement you will just get a blank page with the word 'false' or 'pass' on it.

Secondly,
It is important to realise that the downloaded and unzipped files are encrypted in Windows 7 (and possibly other Windows versions) so will not be accessible through WAMP as they stand. You will constantly receive a 403 error when trying to access them until you remove encryption.

John Gill  Nov 10, 2013 
Printed Page 368
bullet point 7

For some reason I did not get the expected result here. It was only after comparing the completed version and a few tests removing and adding sections of the complete code to my version did I find that you must also add the 'return false' statement onto line 11 (after declaring the processData function and before the end of the 'submit' function) in order to get the expected result

Anonymous  May 13, 2017 
Printed, PDF, ePub, Mobi, Page 371-375
all JSON examples

All of the JSON examples on pages 371-375 are wrong. These are not JSON, they are JavaScript object literals. There's a big difference. In JSON, all strings must be enclosed in double quotes. Neither unquoted identifiers nor single quoted strings will work, only double quotes are acceptable. Test the book code using any JSON validator and you will see that it fails validation. In addition, function processContacts on page 373 will not work because the getJSON call (which should not have a space) will fail silently and not pass the data parameter. If program contacts.php uses the PHP function to generate JSON, it will properly enclose evrything in double quotes. But the var data = { ... } lines in the book are not what PHP returns. -- Jesse Heines, UMass Lowell Dept. of Computer Science, heines@cs.uml.edu

DrJay  Oct 06, 2013 
Printed Page 398
United States

Page 398 step 3
#map {
height: 400px;
width: 760px;
}

last sentence reads map area is 500 pixels square.

they are set for 400 pixels by 760 pixels

should read

map are was set to 400 pixels by 760 pixels

or the code should be
#map {
height: 500px;
width: 500px;
}

  Aug 10, 2014 
Printed Page 399
United States

page 399
step 11

next to last paragraph
This sets up a marker at the same location as the center of the map.
s/b
This sets up a marker at hole 1 on the map.


The map center created in step 10 is set to
latitude: 45.53940,
longitude: -122.59025


step 11 sets the marker at
latitude: 45.53743,
longitude: -122.59473
which is in the lower left corner at hole1 not the center.



  Aug 10, 2014 
Printed, PDF Page 434
United States

This sentence:
"To create a regex with a literal period, add a slash before it;..."

...would be more clear if it said "add a backslash before it."

Matt Barney  Jan 24, 2014 
Printed, PDF Page 437
United States

This sentence:
"...escape the character (just like
escaping the quotes discussed on page 44) with the forward slash character."

...should say "with the backslash character."

Matt Barney  Jan 24, 2014 
Printed Page 448
Code sample at top of page

The first comment in the code sample should read "won't run because x is a number". The variable x is always a number in that snippet of code.

Anonymous  May 06, 2014 
, Printed Page 473
Second paragraph under "Single Equals in Conditional Statements"

The code example presents the error where a single equals sign is used in an if statement:
if (score=0) {
alert('game over');
}
The text then continues: "However, in this case, the alert message will 'always' display, no matter what value is stored in 'score' prior to the conditional statement."

This is incorrect. In this example, the alert message will never display. The reason is that the value 0 is assigned to the variable 'score', and this value is evaluated by the if statement. Because 0 always evaluates to false, the alert statement does not execute. If the assignment had been "if (score=1)", then the value 1 would have been assigned to the variable score and this would have been evaluated as true and the alert message would have been displayed.

The end of the paragraph states "The JavaScript interpreter treats an assignment operation as 'true'...". This is incorrect. The interpreter treats it as true or false based on the value of what is on the right side of the equals sign.

You can see this by running the code. You will see that the alert statement is not displayed. Then change the if statement to
if (score=1)
and the statement will be displayed.

The solution in the book to this problem is correct: simply replace the single equals sign with a double equals sign. So "if (score=0)" should be replaced by "if (score==0)".

Barry Gruber  Jan 05, 2014 
PDF Page 474
Pt. 6 & 7 of tutorial

First there is this code listed in pt. 6:
$('.main').html('<p>You have successfully logged on!</p>');

Then there is this in pt. 7:
$('#content').html('<p>You have successfully logged on!</p>');


"#content" should be changed to ".content".

edyta jordan  Sep 25, 2016 
Printed Page 491
Step 4, paragraph 1, sentence 2

"line 10" should be "line 9", at least according to the exercise files that I downloaded.

Anonymous  May 06, 2014 
Printed Page 495
Box note

"red circles to the right of" should be "red circles to the left of"

Anonymous  May 06, 2014 
Other Digital Version 542
Code after paragraph 1

Using jquery-1.11.0 it seems that use of field.attr('defaultValue') causes the code not to run right because defaultValue is returned as "undefined" by attr(), thus field.val() will never match field.attr('defaultValue).

Per jQuery api http://api.jquery.com/attr/, "As of jQuery 1.6, the .attr() method returns undefined for attributes that have not been set. To retrieve and change DOM properties such as the checked, selected, or disabled state of form elements, use the .prop() method."

Changing from attr() to prop() allows example to run. Replace code line 3 with:

if (field.val()==field.prop('defaultValue'))

Rebecca Docimo  Aug 08, 2014 
Other Digital Version 821
kindle 821/17568 fadeIn.html

fadeIn.html does not exist

slide.html is the file that is in the downloaded files.

Samuel Roberts  Jan 22, 2016 
Other Digital Version 1068
2nd paragraph starting with "You can use..."

“this is not right”

should be "this is not right'. You are displaying an error.

Samuel Roberts  Jan 22, 2016