0

我目前正在尝试在用户已上传的图片列表上制作悬停效果(使 div 淡入,然后在不悬停时退出)。因为我不希望我的所有图片在选择其中一张图片时都悬停,所以我让 PHP 回显了一个用于 div id 的变量。

在下面的 jQuery 代码中,我有一个循环,我从 1 计数到 16(这是我画廊中的图片数量),并且选择器具有 div 的名称。

PHP部分:

                        echo "<div class='cell1' id=sovs$sovs style='overflow: hidden; position: relative;'>
                                <a href=image.php?p=$presentnew->upload_id>
                                <img style='min-width: 177px; min-height: 177px;' src='content/$presentnew->user_name/thumbs/medium_$presentnew->file_name'>
                                <div class='celltext'>
                                <b style='color: white; line-height: 28px; margin-left: 5px; font-size: 10pt;'><a style='color: white;' href='profil.php?bruger=$presentnew->user_name'>$presentnew->user_name</a></b>
                                </div>
                                </a>
                            </div>";
                        $sovs++;
                    }

Javascript部分:

for (var h = 1; h <= 16; h++) {
    $(function() {
        $("#sovs" + h).hover(

        function() {
            alert("g");
        });
    });
}​

上面的代码只是我希望我的 div 响应函数的测试。

问题是他们不这样做。如果我将选择器的名称更改为,例如,他们会做出响应$('#sovs1')

有人可以告诉我我做错了什么吗?

$(document).ready(function(){
for(var h=1; h<=16; h++){   
        $("#sovs"+h).mouseover(function(){
                alert("G");                                  
            });   

    }
});

有效,但如果我将fadeIn函数附加到它,它不会

4

2 回答 2

1

您将不得不提供更多信息才能获得答案,这只是一件重要的事情:

for (var h = 1; h <= 16; h++) {
    $(function() { // <======= This will create 16! dom ready event handlers
        $("#sovs" + h).hover(

        function() {
            alert("g");
        });
    });
}​

将其移动到外部范围(如果需要的话..)

$(function() {
    for (var h = 1; h <= 16; h++) {
        $("#sovs" + h).hover(function() {
            alert("g");
        });
    }
}​

试试这段代码,看看问题是否出在委托事件 VS 直接事件上。

$(function() {
    for (var h = 1; h <= 16; h++) {
        $('body').on('mousemove', "#sovs" + h, function() {
            alert('g');
        });
    }
}​
于 2012-06-06T10:58:50.307 回答
0
$(document).ready(function() {
     for(var h=1; h<=16; h++) {   
        $("#sovs"+h).live('hover', function() {
                alert("g");                                         
        });   
    }
});
于 2012-06-06T10:58:58.760 回答