jQuery UI API - plug-in bridge (Widget Plugin Bridge)

category

Utility (Utilities) | widgets (Widgets)

usage

Description: jQuery.widget.bridge () method is a jQuery widget library (Widget Factory) part of. It plays an intermediary object consists of $ .widget () to create and jQuery API between.

$.widget.bridge() to do the following things:

• Connected to a regular JavaScript constructor to jQuery API.
• Automatically create an object instance, and stored in an element of $.data within the cache.
• Allowed to invoke public methods.
• Prevent call the private methods.
• Prevent invoke methods on an uninitialized object.
• Prevent multiple initialization.

jQuery UI widgets using $.widget( "foo.bar", {} ); }); syntax definition of an object to create. Given with a five .foo , $ $( ".foo" ).bar(); the DOM structure will create five instances of "bar" object. $.widget.bridge() based on the "bar" object and a common API to work in the library. Therefore, you can write $( ".foo" ).bar() ) to create an instance, by writing $( ".foo" ).bar( "baz" ) "baz") to invoke the method.

If you want a one-time initialization and call the method, then the message you send to jQuery.widget.bridge() object can be very small:

var Highlighter = function (options, element) {
  this.options = options;
  this.element = $ (element);
  this._set (800);
};
Highlighter.prototype = {
  toggle: function () {
    this._set (this.element.css ( "font-weight") === 400 800: 400?);
  },
  _set: function (value) {
    this.element.css ( "font-weight", value);
  }
};

Here you need is a constructor that accepts two parameters:

• options : Options configuration of an object
• element : the DOM element on which to create the instance of

Then you can use the bridge (bridge) to the object as a jQuery plugin, and you can use it on any jQuery object:

// Hook up the plugin
$ .widget.bridge ( "ColorToggle", Highlighter);
 
// Initialize it on divs
$ ( "Div") .colorToggle (). Click (function () {
  // Call the public method on click
  $ (This) .colorToggle ( "toggle");
});

In order to use the bridge (bridge) all the features you need to have a prototype object _init() method. This method is called the plug-in calls and examples already exist. In this case, you also need to have an option() method. The method will be to options as the first argument is called. If there is no option, the argument is an empty object. For option to use it, please see $.Widget .

Bridge (bridge) has an optional attribute, if it exists: If the object has a prototype widgetFullName property, the property will be used as the key to store and retrieve instances. Otherwise, the name parameter.