Question

我有一个非常简单的问题，需要大量标记才能导航。我已经上传了一个包含相同.html内容的文件供审核。这里发布的时间太长了（标记为@ 1500行），但我可以给＃行注释。

http://www.sinsysonline.com/repair/price.html

jQuery的：

<script>
    (function() { 

       $('tr.catTr td').not('.category').hover(function () {

            var priceSel = $(this).index();

            $('tr.priceRow td').eq(priceSel).addClass('price_hover');
            $('tr.priceRow2 td').eq(priceSel).addClass('price_hover');
            $('tr.catTr td:nth-child(' + (priceSel + 1) + ')').addClass('vertFilt');
            $(this).parent('tr').find('td.category').addClass('category_hover');
            $(this).parent('tr').find('td').not('.category').addClass('rowHov');

        }, function () {
            var priceSel = $(this).index();
            $('tr.priceRow td').eq(priceSel).removeClass('price_hover');
            $('tr.priceRow2 td').eq(priceSel).removeClass('price_hover');
            $('td.vertFilt').removeClass('vertFilt');
            $(this).parent('tr').find('td.category').removeClass('category_hover');
            $(this).parent('tr').find('td').removeClass('rowHov');
       });

})();
</script>

问题似乎是我的功能专门针对垂直突出显示（桌面/笔记本电脑/服务器），以及我在底部的次要突出显示，仅适用于 Drop关闭页面。

让我现在提出我的理论......

每张桌子的ID都是'价格'：总共4个，行： 348,541,735,968 。如果我把它变成一个类而不是一个ID，我的CSS会破坏水平定位。

我一直认为多个ID都可以，只要一次只能看到一个：ex：http://www.sinsysonline.com/repair/contact.html

这是因为只有第一页突出显示上层和下层悬停系统，还是其他东西在起作用？

我可以在这里修改一些仅针对可见表的内容吗？

var priceSel = $(this).index();
        $('tr.priceRow td').eq(priceSel).addClass('price_hover');
        $('tr.priceRow2 td').eq(priceSel).addClass('price_hover');

再一次：

http://www.sinsysonline.com/repair/price.html

Answer 1

<script>
    (function() { 

       $('tr.catTr td').not('.category').hover(function () {

            var priceSel = $(this).index();
            console.log(priceSel);
            $(this).closest('table').find('tr.priceRow td').eq(priceSel).addClass('price_hover');
            $(this).closest('table').find('tr.priceRow2 td').eq(priceSel).addClass('price_hover');
            $('tr.catTr td:nth-child(' + (priceSel + 1) + ')').addClass('vertFilt');
            $(this).closest('tr').find('td.category').addClass('category_hover');
            $(this).closest('tr').find('td').not('.category').addClass('rowHov');

        }, function () {
            var priceSel = $(this).index();
            $(this).closest('table').find('tr.priceRow td').eq(priceSel).removeClass('price_hover');
            $(this).closest('table').find('tr.priceRow2 td').eq(priceSel).removeClass('price_hover');
            $('td.vertFilt').removeClass('vertFilt');
            $(this).closest('tr').find('td.category').removeClass('category_hover');
            $(this).closest('tr').find('td').removeClass('rowHov');
       });

})();
</script>

解决问题

将函数应用于具有ID的同一Div中的所有表 - jQuery Show / Hide

1 个答案: