简体   繁体   中英

jQuery click events don't work on page, but they work on jsFiddle

I checked js tags are just fine, everything is closed, but the js all of sudden decides not to work. I have the code working in JSFiddle so I know it has to be something I did or possibly the server. I just need some outside influence to make sure it's not oversight.

This is the site with the problem. Here's the code:

$(document).ready(function(){
    $(".designers").show();
    $('.list').hide();
});

$(".but").click(function(){
    $(".designers").hide();
    $(".list").show("slide", { direction: "down" }, 1000);
});

$(".but2").click(function(){
    $(".designers").show();
    $(".list").hide("slide", { direction: "down" }, 1000);
});

The event handlers should go in the ready function as well:

$(document).ready(function(){
    $(".designers").show();
    $('.list').hide();

    $(".but").click(function(){
        $(".designers").hide();
        $(".list").show("slide", { direction: "down" }, 1000);
    });

    $(".but2").click(function(){
        $(".designers").show();
        $(".list").hide("slide", { direction: "down" }, 1000);
    });
});

JsFiddle automagically sticks everything in a document ready, that's why it works there and not on your site, as you're trying to fetch the elements before they are added to the DOM.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM