transitioning from .live to .on in updated jQuery Library

Question

following this link:

I feel like what I have is right, but it's not executing. I'm upgrading from jQuery 1.5 to 1.9, I've replaced .live() with .on() but my code still isn't executing properly. Is there something that I'm doing wrong?

was:

$('a[rel != "noAJAX"]').live('click', function(event){

Now:

   $('a[rel != "noAJAX"]').on('click', 'a', function){

Full code:

$(function(){ 
  // Link handling.
  $('a[rel != "noAJAX"]').on('click', 'a', function){   
    if ($(this).attr('name') != ""){        
        var currentDiv = $(this).attr('name');      
    }else{      
        var currentDiv = divID;         
    }   
    $(currentDiv).html(loadingHTML);        
    $(currentDiv).load($(this).attr('href'));   
    event.preventDefault();     
  }); 
  $('form[rel != "noAJAX"]').on('submit', function(event){  
    if ($(this).attr('name') != ""){                
        var currentDiv = $(this).attr('name');      
    }else{      
        var currentDiv = divID;         
    }   
    $(currentDiv).html(loadingHTML);    
    $.post($(this).attr('action'), $(this).serialize(), function(html){         
        $(currentDiv).html(html);       
    });
    return false;   
  });  
});

Did you do what I suggested in the comments on your last question? — j08691, Oct 17 '14 at 20:58

score 0 · Answer 1 · answered Oct 17 '14 at 21:07

Your use of .on() is incorrect, and you prematurely closed the function:

 $('a[rel != "noAJAX"]').on('click', 'a', function){ ... }

Even if you correct your syntax into the following, it will not work:

$('a[rel != "noAJAX"]').on('click', 'a', function(){ ... });

The above line simply instructs jQuery to listen for the click event bubbling up to the anchor element with the rel attribute of "noAJAX", and the event has to originate from a nested anchor element. In addition, the attribute selector != is invalid. You might want to try looking at :not() instead. You should try:

$(document).on('click', 'a:not([rel="noAJAX"])', function() {...});

See proof-of-concept fiddle here: http://jsfiddle.net/teddyrised/rh38eu4n/

transitioning from .live to .on in updated jQuery Library

1 Answers1