IE 10, HTML5 and jQuery 2.x - JavaScript runtime error: 'JSON' is undefined

While debugging HTML5 web pages with jQuery based scripts in Visual Studio 2012 using IE 10, if you see an error similar to following:

Error Unhandled exception at line XXX, column 1 in https://localhost:8135/Scripts/jquery-X.y.z.js 0x800a1391 - JavaScript runtime error: 'JSON' is undefined

 

Associated Visual Studio 2012 Exception

And if you are able to debug the same page in Visual Studio 2012 using the latest versions of any of the following browsers without any issues:

  • Opera,
  • Chrome,
  • Firefox and
  • Safari etc.

Then make sure that Compatibility View settings in IE 10 are turned “Off” for the domain (or host name) of the IIS site where your page is hosted. In my case I found that “localhost” was added to Compatibility View, so just removing it from there solved the problem.

IE 10 Compatibility View Settings Dialog

For more details on why this is an issue, will recommend reading following MSDN article:

Defining Document Compatibility

 Update 18-Aug-2013: Changed the blog title to reflect that this applies only to JQuery 2.x. ['JSON' is undefined] is not an issue with JQuery 1.x. 

Following tables further detail out IE 10 behaviour across compatibility modes, settings and jQuery versions: