The issue was with an Ajax request I was sending. The return value was an array in JSON form. More specifically, the server was returning something like:

{tag:[{id1:'A',id2:'B'}, {id1:'A',id2:'B'}, {id1:'A',id2:'B'}]}

This was perfectly valid and worked fine in both Firefox and Internet Explorer. However, in Opera 9.26, I got a JavaScript error indicating that the JSON was not valid. It was then that I realized I was using an older version of jQuery, v1.2.2. Upgrading to the latest, 1.2.6 fixed the problem. Strangely, I could not find anything on their bug tracker indicating that such a problem (JSON and Opera) had been fixed.

What was even more interesting was that upgrading to Opera 9.50 also solved the problem independently; that is, things worked fine even with the older version of jQuery. This goes to show the importance of keeping your software up to date and highlights the complicated interactions between different browsers and client-side code in a web application.

Share This is an excellent WordPress plugin written by Alex King. The plugin provides a neat and customizable pop-up menu for allowing readers to easily share one of your blog posts using many of the social bookmarking or social websites out there. It’s an intelligent solution to the problem of having too many sharing icons that may potentially distract or irritate readers.

Since launching, Share This has become very popular, with many blogs using it. I recently began using the plugin for a site of mine, and was impressed by its usefulness. (And the icon project it launched) However, I had also decided to use the jQuery JavaScript framework (and its plugins) for this site, and since Share This uses Prototype for its JavaScript functionality, there were some conflicts.

So, I decided to do a minor re-write of Share This, altering only the JavaScript portion to use jQuery instead of Prototype.

jQuery?

I wanted to stick with jQuery for a variety of reasons, but mainly because I have more experience with it than with Prototype. I won’t get into an argument over which of the frameworks is better, and will instead stick to the “Unto each his own” line of thinking.

While jQuery generally works well with existing JavaScript, as it doesn’t alter the global namespace, and additionally has a “no-conflict” mode, some of the plugins that I wanted to use (specifically Thickbox) weren’t written for the no-conflict mode. The issue stems from the use of the “$” variable name. In jQuery, it’s a shortcut for the be-all-end-all function jQuery(), while in Prototype, it’s a shortcut for document.getElementById().

Share This in jQuery

Before I offer the download, I want to make it clear that this was a very minor change - no functionality was added or removed, as just the JavaScript portion was re-written (quickly) to support jQuery instead of Prototype. Again, it’s not better than the original Share This, only different. Furthermore, 100% full credit still belongs to Alex King, as this is barely a derivative work.

In order to use this version, you will need the jQuery framework as well as the Dimensions plugin. Their cumulative compressed sizes are comparable to the compressed size of the Prototype framework. You will need to link them to your site in your WordPress theme’s header.php file by adding lines like these, preferably between the head tags.

<script type="text/javascript" src="/path-to-jquery/jquery.pack.js"></script>
<script type="text/javascript" src="/path-to-jquery-dimensions/jquery.dimensions.pack.js"></script>

You can then replace the original share-this.php with the jQuery version in the zipped download. (You may want to backup the original file first, as always)

Download

• Share This 1.4 for jQuery

Credit and Misc.

As mentioned before, all credit still belongs to Alex King for writing Share This in the first place. I haven’t really changed anything, just adapted it to work with jQuery and thought I’d like to make it available for everyone to use. It still works exactly as before, so configuring options and so forth isn’t any different.

What I changed was just the part of the plugin that outputs the JavaScript necessary to make Share This work. It’s just been changed to use jQuery instead of Prototype. I also commented out the parts of the plugin that link the Prototype framework (from WordPress) into the header. As mentioned before, you’ll have to link in the requisite jQuery script files yourself. Since it looks like WordPress will be moving over to jQuery, at least for the admin pages, this might be something worthwhile.

The JavaScript has been written in jQuery’s compatibility mode (using jQuery() instead of $), so you can continue to use Prototype on your site if you wish. As mentioned, this was a very quick rewrite, so not much has changed.

Some people have pointed out that Prototype is a lot larger than jQuery in terms of file size. This may be somewhat true, but when Prototype v 1.5.0 is packed, it comes in at only around 27 KB. jQuery packed is about 21 KB, but with the Dimensions plugin needed to make Share This work with jQuery adds another 4-5 KB, bringing the total size close to that of Prototype. So why use jQuery? Again, it’s just because I’m more familiar with it and like how jQuery expressions are formed, particularly with the ability to chain function calls.

Update

Bennett McElwee, author of many nice WordPress plugins (including some that I use on my own site), has already released a version of Share This in jQuery, seemingly two days before I published this post - what a coincidence! His appears to be more polished, though, as it doesn’t use the extra Dimensions plugin and also includes some nice effects. Definitely give it a try.