user3353290
user3353290

Reputation: 21

jquery .on(click) not working

i have a link on html

<a href="#instalacoes" id="instalacoesbutton">Veja aqui »</a></p>

and i'm using .on() to do a transition and load content from a external file

$(document).on("click", '#instalacoesbutton', function(){
$("#maincontent").slideUp(1000, function () {
$("#maincontent").load("instalacoes.html #instalacoes");
}).delay(500).slideDown(1000);
});

any idea why this doesn't work?

if i do:

$("#instalacoesbutton").on("click", function(){
$("#maincontent").slideUp(1000, function () {
$("#maincontent").load("instalacoes.html #instalacoes");
}).delay(500).slideDown(1000);
});

it works, for the 1st click, but doesn't after the page has been generated dinamically

Upvotes: 2

Views: 82

Answers (2)

AKHolland
AKHolland

Reputation: 4445

If you want the action to fire on all future elements which match that selector, you can set up a click on the document and look for a clicks on that item. This would look something like:

$(document).click(function (e) {
    if ($(e.target).is(".testSelector")) {
        // do stuff to $(e.target)
    }
});

Upvotes: 1

martynas
martynas

Reputation: 12300

Here you go:

jQuery:

$(document).ready(function() {
    $("#instalacoesbutton").on("click", function() {
        $("#maincontent").slideUp(1000, function () {
            $("#maincontent").load("instalacoes.html #instalacoes");
        }).delay(500).slideDown(1000);
    });
});

Try it yourself on jsFiddle

Upvotes: 2

Related Questions