即使CSS选择器执行,单击功能也不起作用

时间:2014-01-18 21:46:48

标签: javascript jquery html

我有一个缩略图库,所有缩略图都是.thumb类,由朋友写的php代码添加。我尝试添加一个简单的点击功能:

$('.thumb').click(function  () {
        console.log('test');
    });

它没有记录任何东西。在我们切换到php之前我曾经尝试过这个,但它仍然没有用。 (那时图像是用jQuery

导入的

以下是相关的html代码:

<div id="navbar">
<img src="images/sig.png">
<ul>
    <li id="port"><a>Portfolio</a></li>
    <ul id="inner">
    <?php
    $dir = opendir("images/portfolio");
        while ($dosya = readdir($dir)){
            if(substr($dosya,-1)!="." and is_dir("images/portfolio/".$dosya)){
                    if(file_get_contents("images/portfolio/".$dosya."/active.dl") == 'active'){

    ?>
        <li class="galleryActivator" cats="<?=$dosya?>"><a href="#"><?=file_get_contents("images/portfolio/".$dosya."/name.dl")?></a></li>

    <?php }} 
        }?>
    </ul>
    <li><li><a href="#">Events</a></li></li>
    <li><a href="#">About</a></li>
</ul>

</div>

<div id="main">
<div id="thumbnails">
</div>
</div>

脚本:

(function(){
    $('#inner').hide();
    $('#main').hide();
    $('#slideshow').hide();

    $('#port').click(function(){
        $('#inner').slideToggle(200);
        console.log('test');
    });

    $('.galleryActivator').click(function () {
        $("#main").hide();
        $("#main img").remove();

        var category = $(this).attr('cats');
        var catSrc = "images/portfolio/" + category + "/files/";
        var size = $(this).attr("data-size");
        console.log(size);

        var $thumbnails = $("#thumbnails");


            $thumbnails.load( "albumler.php?adres="+category );



        $('#main').fadeIn(200);
    });

    $('.thumb').click(function  () {
        console.log('test');
    });

})();

2 个答案:

答案 0 :(得分:1)

似乎您正在动态加载缩略图;你应该设置你的事件处理程序:

$(document).on("click", ".thumb", function  () {
    console.log('test');
});

答案 1 :(得分:-1)

您的上述HTML中没有任何类似thumb

的内容

但是,只需添加文档就可以了

$(document).ready(function(){       

    $('.thumb').click(function  () {
        console.log('test');
    });

});