CODEWITHSUNDEEP
javascriptjqueryevent-handling
hamburger
hamburger

Reputation: 1425

jquery migration from 1.7 to 1.10.1

I'am trying to migrate from jquery 1.7 to 1.10 and the live function do not work anymore.

$("#detail_content").on("click", ".close", function (a) {  // is ignored
//$("#detail_content .close").live("click", function (a) { //works fine with migrate
  console.log("click");
});

the div.detail_content is loading later via ajax but the close button do not work anymore if i change from .live to .on

I think the delegation is missing.

any idea?

Upvotes: 0

Views: 3429

Answers (4)

Majid Golshadi
Majid Golshadi

Reputation: 2706

The .live() method is deprecated in jQuery 1.10 and above. Use .on() method to attach event handlers.

So you can use this code instead of .live()

 $(document).on('click', '#detail_content .close', function(){
      //your Code
 });

I think this answer is useful for you and in this page you can see all deprecated method and it's useful for someone who want to migration from 1.7 to 1.10

Upvotes: 1

Sean Kendle
Sean Kendle

Reputation: 3609

VisioN, is it not the same to just use the following?

$(document).ready(function(){
    $(".close").click(function(){
        console.log("clicked");
    }
});

Is there something about the code above that is slower or less efficient somehow?

Upvotes: 0

VisioN
VisioN

Reputation: 145388

You should use any closest static parent element (or body at last):

$("body").on("click", "#detail_content .close", function() { ... });

So if you have the markup like:

<body>
    ...
    <div id="container">
        ...
        <div id="detail_content"><button class="close">Close</button></div>
    </div>
</body>

and #container is not replaced after Ajax call, then it is better to use:

$("#container").on("click", "#detail_content .close", function() { ... });

Upvotes: 2

Arun P Johny
Arun P Johny

Reputation: 388316

Looks like #detail_content also is an dynamic one, then try

$(document).on("click", "#detail_content .close", function (a) {  // is ignored
//$("#detail_content .close").live("click", function (a) { //works fine with migrate
  console.log("click");
});

Upvotes: 4

Related Questions