Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Exclamation mark doesn't work in trigger() when using event namespace in jQuery 1.9

Tags:

jquery

Here is the code:

$("div").on("click",function(){
       console.log("click");
});
$("div").on("click.plugin", function(){
       console.log("click.plugin");
});
$("button").click(function() {
      $("div").trigger("click!");    
});

and the HTML:

<div>test.</div>
<button >Trigger event according to namespace</button>

When I run the code under jQuery 1.8.3, it works. When I click button, it logs click in the console.

But when I change to jQuery 1.9.1, nothing happens when I press the button. It seems like the exclamation mark doesn't work anymore in 1.9.1.

I can't find this change in the 1.9 upgrade guide. Does anybody know why?

like image 341
James Avatar asked May 09 '13 09:05

James


2 Answers

Use .$ instead of !

$("button").click(function() {
      $("div").trigger("click.$");    
});

Demo [Credits: Tim B James]

like image 118
Starx Avatar answered Nov 08 '22 03:11

Starx


This is how jQuery 1.8.3 looks like:

trigger: function( event, data, elem, onlyHandlers ) {

    // Don't do events on text and comment nodes
    if ( elem && (elem.nodeType === 3 || elem.nodeType === 8) ) {
        return;
    }

    // Event object or event type
    var cache, exclusive, i, cur, old, ontype, special, handle, eventPath, bubbleType,
        type = event.type || event,
        namespaces = [];

    // focus/blur morphs to focusin/out; ensure we're not firing them right now
    if ( rfocusMorph.test( type + jQuery.event.triggered ) ) {
        return;
    }

    if ( type.indexOf( "!" ) >= 0 ) {
        // Exclusive events trigger only for the exact event (no namespaces)
        type = type.slice(0, -1);
        exclusive = true;
    }

    if ( type.indexOf( "." ) >= 0 ) {
        // Namespaced trigger; create a regexp to match event type in handle()
        namespaces = type.split(".");
        type = namespaces.shift();
        namespaces.sort();
    }

    // ...

Notice the "Exclusive events trigger only for the exact event" section.

And this is jQuery 1.9.1:

trigger: function( event, data, elem, onlyHandlers ) {
    var handle, ontype, cur,
        bubbleType, special, tmp, i,
        eventPath = [ elem || document ],
        type = core_hasOwn.call( event, "type" ) ? event.type : event,
        namespaces = core_hasOwn.call( event, "namespace" ) ? event.namespace.split(".") : [];

    cur = tmp = elem = elem || document;

    // Don't do events on text and comment nodes
    if ( elem.nodeType === 3 || elem.nodeType === 8 ) {
        return;
    }

    // focus/blur morphs to focusin/out; ensure we're not firing them right now
    if ( rfocusMorph.test( type + jQuery.event.triggered ) ) {
        return;
    }

    if ( type.indexOf(".") >= 0 ) {
        // Namespaced trigger; create a regexp to match event type in handle()
        namespaces = type.split(".");
        type = namespaces.shift();
        namespaces.sort();
    }

    // ...

Here the entire section is missing (it's also not in the omitted bit).

It seems as if jQuery has dropped support for this feature. The variable exclusive has been removed from the whole source.

Looking at the source of version 1.9.1 I don't see a way for you to get the desired functionality without resorting to hacks.

like image 4
Tomalak Avatar answered Nov 08 '22 02:11

Tomalak