Question

我想在表格的多个框中使用jQuery mouseenter / mouseleave，所以我决定将id更改为类（只需在js文件和html文件中切换＃到。），如下所述。它停止了工作！

然后我根据我在stackoverflow中找到的不同线程尝试使用$(document).on('.class',和最近$(".class").live - 这也没有用，所以我将代码还原为我原来的修改 - 见下文

我对此很新，所以我可能会遗漏一些明显的东西，但到目前为止我还没有找到解决办法。

HTML文件

    <div class="col-sm-3">
        <div class="hover">
            <div class="list-group">

                <a class="list-group-item">
              <span class="text-success"></span><div class="hide">One</div><div class="show">hi</div></a>

            </div>
        </div>
    </div>

JS文件

//Hides detail initially
$(".show").hide();
//Shows added detail upon hover and gets rid of title
$(".hover").mouseenter(function() {
    $(".show").show();
    $(".hide").hide();
})
//Returns to normal on mouseoff
$(".hover").mouseleave(function() {
    $(".show").hide();
    $(".hide").show();
})

编辑

这是我的不好，我在HTML文件中以错误的顺序导入Javascript文件！

Answer 1

（表格中的多个方框）表示您需要使用$（this）

$(document).ready(function(){
  $(".show").hide();
    //Shows added detail upon hover and gets rid of title
    $(".hover").on('mouseenter',function() {
        $(this).find(".show").show();
        $(this).find(".hide").hide();
    }).on('mouseleave',function() {
        $(this).find(".show").hide();
        $(this).find(".hide").show();
    });  
});

参见演示Live Demo

jQuery停止从ID到类的工作变更？

1 个答案: