CODEWITHSUNDEEP
jqueryclick
jens_vdp
jens_vdp

Reputation: 594

Jquery click only executing once

my code is only working once. When I click on the button, the code executes fine. But when I do the same after it executed fine once, it doesn't work, I don't even get the alert('clicked').

Anyone knows why? Here is the code:

$('#eucontentpage #country-choice .item .lang-ico').click(function(){
    alert('clicked');
    $(this).parent().removeClass('item');
    var country = $(this).parent().attr("class");
    var language = $(this).html();
    var pathArray = window.location.pathname.split( '/' );
    var newPathname = "";
    for (i = 0; i < 5; i++) {
      newPathname += pathArray[i];
      newPathname += "/";
    }
    var loadlink = newPathname + country + "/index_"+ language +".htm #nationalcontentpage";

    $.when(
        $('.lightbox').after('<div id="insertnationalcontent"></div>')
    ).done(function() {
        $("#insertnationalcontent").load(loadlink),
        $('#jb-window').hide(),
        $('#jb-window-content').hide(),
        $('#jb-overlay').hide(),
        $(this).parent().addClass('item'),
        $('#insertnationalcontent').fadeIn('slow'),
        $.history.load( '' )
    });

    return false;
});

Upvotes: 0

Views: 44

Answers (3)

Refilon
Refilon

Reputation: 3499

Try it like this:

$('#eucontentpage #country-choice').on("click",".item .lang-ico",function(){ // this first part is different
    alert('clicked');
    $(this).parent().removeClass('item');
    var country = $(this).parent().attr("class");
    var language = $(this).html();
    var pathArray = window.location.pathname.split( '/' );
    var newPathname = "";
    for (i = 0; i < 5; i++) {
      newPathname += pathArray[i];
      newPathname += "/";
    }
    var loadlink = newPathname + country + "/index_"+ language +".htm #nationalcontentpage";

    $.when(
        $('.lightbox').after('<div id="insertnationalcontent"></div>')
    ).done(function() {
        $("#insertnationalcontent").load(loadlink),
        $('#jb-window').hide(),
        $('#jb-window-content').hide(),
        $('#jb-overlay').hide(),
        $(this).parent().addClass('item'),
        $('#insertnationalcontent').fadeIn('slow'),
        $.history.load( '' )
    });

    return false;
});

Upvotes: 1

AsgarAli
AsgarAli

Reputation: 2211

You are doing $(this).parent().removeClass('item'); So when this code executes it removes item class that's why your DOM selector is not matching.

Just comment below line your code will be executed multi time. $(this).parent().removeClass('item');

Upvotes: 0

johanthuresson
johanthuresson

Reputation: 580

You are removing the "item" class from the parent object. while using it in the object reference "#eucontentpage #country-choice .item .lang-ico".

After removing the item class your referens does not match the any more.

try using just

$('.lang-ico').click(function(){...}

Upvotes: 0

Related Questions