18 Nov 2013, 03:04
Generic-user-small

Fang HsienTe (2 posts)

My environment:

Mac OS X 10.7.5,

Chrome version: 31.0.1650.57

When I run the example code with chrome in html5_content_editable/show.html, I got a TypeError exception. screen capture

But the example code was executed correctly with firefox.

When I change the code from:

if(hasContentEditableSupport()){
  $("#edit_profile_link").hide();
  var status = $("#status"); 
  $("span[contenteditable]").blur(function(){
    var field = $(this).attr("id");
    var value = $(this).text();

to: (just move the variable status’s definition)

if(hasContentEditableSupport()){
  $("#edit_profile_link").hide();
  $("span[contenteditable]").blur(function(){
    var status = $("#status");
    var field = $(this).attr("id");

And the code worked!

I am not familiar with javascript scope. Do you think it’s a bug in chrome?

22 Nov 2013, 04:09
Bphogan_pragsmall

Brian P. Hogan (145 posts)

That’s creepy. I’ll investigate because I can reproduce this.

22 Nov 2013, 15:21
Bphogan_pragsmall

Brian P. Hogan (145 posts)

Well, it appears to be a name collision. status is actually a property on the Window object. Chrome’s not handling the reassignment properly.

Simply changing

var status = $("#status");

to

var statusArea = $("#status");

seems to fix it here.

It also seems that putting it in a document.ready event handler fixes the problem as well.

The most appropriate fix, however, is probably to do something a little safer, like using a global application object instead of the Window object. I thought that might be a little out of scope for this book though.

var myApp = {};  // our app object
myApp.status = $("#status");

and then just reference it through

myApp.status.html();

instead. This way you’re only putting one new variable on the Window object (the myApp) variable.

Thanks for pointing this out - this will be something I’ll investigate fixing more broadly.

24 Nov 2013, 07:17
Generic-user-small

Fang HsienTe (2 posts)

Cool!

Thanks for your explanation!!

  You must be logged in to comment