Plugins
Home

The plugins site is currently in development.

We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.

object


$.diff

Submitted by Marc Rutkowski on September 16, 2010 - 6:16am

jQuery Diff objects Plugin

$.diff(obj1, obj2) returns an object containing the differences between two objects.

The result object looks like this : {mod: ..., add: ..., del: ...} reflecting the modified, added and deleted properties into the copy of the original data.

Copyright 2010, Marc Rutkowski / Attractive Media
Dual licensed under the MIT or GPL Version 2 licenses.

Based upon the code of Michael Schøler

jQuery Class Builder

Submitted by deadalnix on July 17, 2010 - 6:55pm

Plugin presentation

This plugin allow the user to use object oriented programmation in javascript like inheritance and polymorphism.

The plugin usage is really simple. use the function $.classBuilder to create your classes, and then use them to instanciate objects.

$.classBuilder as one parameter and one optionnal parameter. The first one is a class definition object, the second one a super class, if revelant, for inheritance.

The class definition object contains all methods we can apply on the object and static fields as object properties. The special propertie constructor is reserved for the class constructor. See the exemple below :

var classDef = {
    constructor : function(){ alert('class constructor'); },
    method : function(){ alert('I am a method'); },
    staticField : 3,
};

The superclass is simply another class defined by $.classBuilder . If specified, our class will inhertir from the superclass.

Replace Text with Element

Submitted by joshnaro on June 16, 2010 - 4:56pm

This small plugin replaces text in an element with a user defined element. For example:

HTML
-------
<div>
  <p id='demoElement'>I like {0}, even though one ripped my arm off.</p>
</div>

JavaScript
-------------
var testLink = $(document.createElement('a')
  .attr('href', 'http://en.wikipedia.org/wiki/Monkey')
  .html('monkeys')
  .mouseover(function() { alert('Watch out....MONKEY!') });
$('#demoElement').replaceTextWithElement('{0}', testLink);

Will create:

I like monkeys, even though one ripped my arm off.

and on mouse over on the monkey link, the alert will display.

jQuery serializeObject

Submitted by Ben Alman on March 7, 2010 - 9:24pm

Whereas jQuery’s built-in .serializeArray() method serializes a form into an array, .serializeObject() serializes a form into an (arguably more useful) object.

Full documentation, source, and examples are available on benalman.com.

jQuery isjQuery

Submitted by Ben Alman on March 7, 2010 - 9:17pm

Determine if an object reference is a jQuery object.

Since every jQuery object has a .jquery property, it’s usually safe to test the existence of that property. Of course, this only works as long as you know that any non-jQuery object you might be testing has no .jquery property. So.. what do you do when you need to test an external object whose properties you don’t know?

Full documentation, source, and examples are available on benalman.com.

jQuery getObject: get.and.set.deep.objects.easily = true;

Submitted by Ben Alman on December 24, 2009 - 10:19am

jQuery getObject allows you to get and set properties of an object via dot-delimited name string. Inspired by the Dojo methods of the same names.

This plugin is useful if you have deep namespaces or data structures and don’t want to do excessive testing like: if ( a && a.b && a.b.c ) { ... } every time you need to get or set a property or invoke a method.

jQuery type extension

Submitted by songofchrist on June 4, 2009 - 6:14pm

jQuery.type is a very small, but extremely useful extension of jQuery that retrieves and compares types in one simple format. It takes two basic forms:

  • $.type(arg1) - returns the data type, built-in object type, or custom constructor of arg1 ('array', 'boolean', 'date', 'function', 'hash', 'number', 'regexp', 'string', 'undefined', or custom constructor name).
  • $.type(arg1,arg2) - returns true if arg1 is of type arg2, otherwise false. Enter 'a', 'b', 'd', 'f', 'h', 'n', 'r', 's', 'u', some combination of the preceding letters or a custom constructor for arg2. Use a '!' to negate the the comparison.

jQueryUI Frame Dialog

Submitted by tracker1 on March 11, 2009 - 6:08pm

Creates a jQuery.FrameDialog namespace with functions that enhances jQueryUI's Dialog. You can use this extension's .create method the same as an initial call to jQuery.dialog, I've added a url option, and changed a couple defaults to make a little more sense in this context.

The main method will actually create the iframe and append it to the body. Pass the options to the jQueryUI .dialog method, then return the resulting jQuery collection. Upon closing the dialog, it will be removed from the DOM.

Example:

jQuery.FrameDialog
    //create will make an iframe based on the url, other options are
    //    passed to jQueryUI's dialog command.
    .create({
        url: baseURL + '/modal.html',
        title: 'test title'
    })
    //create returns a jQuery object for the dialog created,
    //    from here you can do your event binding.
    .bind('dialogclose', function(event, ui) {
        alert("result:" + event.result);
    });

jQuery Tools / Flashembed

Submitted by tipiirai on March 11, 2008 - 11:38pm

The future of Flash embedding

This plugin is now hosted under the jQuery Tools UI library..

Flashembed is a JavaScript tool that you can use to embed Flash objects to you website. There are other tools for embedding flash objects but none of them offers the same flexibility and ease of use as this one. Here are the highlights: