CODEWITHSUNDEEP
javascriptjquery
chongzixin
chongzixin

Reputation: 1981

$.getScript gives Unexpected token

I found some code online that helps me to provide widgets to my clients. My understanding of the full code below is that it first detects if jQuery is present otherwise loads it. As part of my widget I also want to ensure that fancybox is loaded because I am basically providing a button that onClicks loads an iframe in fancybox.

The particular area of interest is in which .getScript gives me an error Unexpected token .. I know that jQuery is already loaded because .getJSON below works.

Code:

    var fancyboxScript = widgetURL + "fancybox/source/jquery.fancybox.pack.js?v=2.1.5");
    $.getScript(fancyboxScript);

    /******* Load HTML *******/
    var jsonp_url = widgetURL + "widgetCall.php?callback=?";
    $.getJSON(jsonp_url,'merchantID='+merchantID, function(data) {
      $('#widget-container').html(data.html);
    });

The full code is below:

(function() {
// Localize jQuery variable
var jQuery;
var widgetURL = "http://...mywidgetURL/...";
/******** Load jQuery if not present *********/
if (window.jQuery === undefined || window.jQuery.fn.jquery !== '1.4.2') {
  var script_tag = document.createElement('script');
  script_tag.setAttribute("type","text/javascript");
  script_tag.setAttribute("src",
    "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js");
  if (script_tag.readyState) {
      script_tag.onreadystatechange = function () { // For old versions of IE
        if (this.readyState == 'complete' || this.readyState == 'loaded') {
          scriptLoadHandler();
        }
      };
  } else {
      script_tag.onload = scriptLoadHandler;
  }

  // Try to find the head, otherwise default to the documentElement
  (document.getElementsByTagName("head")[0] ||   document.documentElement).appendChild(script_tag);
} else {
  // The jQuery version on the window is the one we want to use
  jQuery = window.jQuery;
  main();
}

/******** Called once jQuery has loaded ******/
function scriptLoadHandler() {
  // Restore $ and window.jQuery to their previous values and store the
  // new jQuery in our local jQuery variable
  jQuery = window.jQuery.noConflict(true);
  // Call our main function
  main(); 
}

/******** Our main function ********/
function main() {
  jQuery(document).ready(function($) { 
    /******* Load CSS *******/
    var css_link = $("<link>", { 
      rel: "stylesheet", 
      type: "text/css", 
      href: widgetURL + "myCSS.css" 
    });
    css_link.appendTo('head');

    /******* Load FANCYBOX *******/
    var fancy_link = $("<link>", { 
      rel: "stylesheet", 
      type: "text/css", 
      href: widgetURL + "fancybox/source/jquery.fancybox.css?v=2.1.5",
      media: "screen"
    });
    fancy_link.appendTo('head');

    var fancy2_link = $("<link>", { 
      rel: "stylesheet", 
      type: "text/css", 
      href: widgetURL + "fancybox/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7",
      media: "screen"
    });
    fancy2_link.appendTo('head');

    var fancyboxScript = widgetURL + "fancybox/source/jquery.fancybox.pack.js?v=2.1.5");
    $.getScript(fancyboxScript);

    /******* Load HTML *******/
    var jsonp_url = widgetURL + "widgetCall.php?callback=?";
    $.getJSON(jsonp_url,'merchantID='+merchantID, function(data) {
      $('#widget-container').html(data.html);
    });
  });
}
})(); // We call our anonymous function immediately

Upvotes: 0

Views: 1855

Answers (2)

dreamweiver
dreamweiver

Reputation: 6002

you have made small mistake in your code 

var fancyboxScript = widgetURL + "fancybox/source/jquery.fancybox.pack.js?v=2.1.5"); //closing round brackets is the issue
$.getScript(fancyboxScript);

you have added a closing round brackets in the line above, hence the syntax error, just remove it and try, it should work as you intended.

Happy Coding:)

Upvotes: 1

chongzixin
chongzixin

Reputation: 1981

well this must be one of the stupidest mistakes on SO. But I hope it saves someone some time in future.

Basically I had an additional ) at the end of my fancyboxScript declaration.

var fancyboxScript = widgetURL + "fancybox/source/jquery.fancybox.pack.js?v=2.1.5");

should have just been

var fancyboxScript = widgetURL + "fancybox/source/jquery.fancybox.pack.js?v=2.1.5";

Upvotes: 1

Related Questions