CODEWITHSUNDEEP
jquerygoogle-gadget
lannyboy
lannyboy

Reputation: 627

How to call jQuery in Google Gadget API

A simple code like this will never work and I searched the entire of the Google, the bloody hell company does not provide a simple tutorial on how to apply the jQuery? This is very frustrating!

<Content type="html"><![CDATA[
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
   <div id="content_div" height="250">abc</div>

   <script type="text/javascript">
       alert($('#content_div').css('height'));
   </script>
   ]]>    
</Content>

What is wrong?

========

If I use this:

<script type="text/javascript" src="https://www.google.com/jsapi"></script>

I will get this error:

enter image description here

If I use this:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>

I will get this error:

enter image description here

The error message:

[blocked] The page at https://pct0pnegjcnktlrmc1cf6dh916jdefnq-a-sites-opensocial.googleuserconte…y%252F8t2ynycEfP2AdZ8IeBvJF%26c%3Denterprise&rpctoken=-2403247092253746774 ran insecure content from http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js.

Upvotes: 4

Views: 2922

Answers (1)

lannyboy
lannyboy

Reputation: 627

Okay, after I read this one https://developers.google.com/speed/libraries/devguide, finally I solved this darn issue...

Instead of

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

It has to be: (the culprit is the "http" scheme)

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

So this is how it will look like:

<Content type="html"><![CDATA[
   <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
   <div id="content_div" height="250px">abc</div>

   <script type="text/javascript">
        $('#content_div').html('123');
   </script>
   ]]>    
</Content>

Upvotes: 3

Related Questions