the this in jquery plugin is giving back undefined

Question

Could someone explain why this.rel is giving back undefined and also what the regex is supposed to do. If this.rel is undefined the regex will not work either and is causing some kind of error because the alert underneath will not fire?

$.fn.facebox= function(settings) {
    init(settings)

    function clickHandler() {
      $.facebox.loading(true)
alert($(this).attr('rel'));
//alert(String(this.rel));
      // support for rel="facebox.inline_popup" syntax, to add a class
      // also supports deprecated "facebox[.inline_popup]" syntax
      var klass = this.rel.match(/facebox\[?\.(\w+)\]?/)
   alert(klass);
alert('ppp');
     // if (klass) klass = klass[1]

      //fillfaceboxFromHref(this.href, klass)
      return false
    }

    return this.click(clickHandler)
  }

thanks, richard

Answer 1

an jQuery-Object has many properties, one of them is an array with the found elements.

You have to walk through this array and bind the event to these single elements:

  jQuery.fn.extend({
facebox: function() 
{
      //here this is a jQuery-object
  function clickHandler() 
      {
        //here this is a DOMElement
        alert($(this).attr('rel'));
        return false
      }

  return this.each(function() {
              var self = jQuery(this);
              self.click(clickHandler)
           });

}});