Question

我有一种情况，我需要将唯一生成的ID名称的一部分与具有相同ID的div的名称匹配，但是用css隐藏。

因此;

<a class="popup" id="productTip348_27598" href="#">Link text</a>

和

<div class="popupContent" id="productTip348_27598"> ... </div>

我的想法是，通过将鼠标悬停在链接上，我将使用魔法显示的相同ID的div.popupContent。将有多个具有相同类的元素，只是ID是不同的。

我很遗憾不是jQuery向导，所以我正在寻找一些帮助。

Answer 1

正如评论中所述，此处的示例中使用了重复的id属性，这些属性无效。

相反，请尝试将div的id显示在href元素的a atrtribute中：

<a class="popup" href="#productTip348_27598">Link text</a>

然后在jQuery中，使用href在悬停时显示相关的div：

$(".popup").hover(
    function() {
        $($(this).attr("href")).show();
    },
    function() {
        $($(this).attr("href")).hide();
    }
);

Answer 2

.popupContent位于.popup元素内吗？如果是的话;

$(document).ready(function() {

  $('.popup').hover(
    function() { // Triggered on both mouseenter and mouseleave events
      $(this).find('.popupContent').toggle();
    }
  );

});

“div.popupContent具有相同的ID”。

ID是唯一的，无法与其他元素共享。

Answer 3

这是我在朋友的帮助下提出的结果。

更改了分配给悬停元素的类的名称。将弹出窗口的ID更改为data-id的ID，因此它在同一时间更加独特且有效。

$(".popupLink").hover(function(){
    var selectedId = $(this).attr("id");
    $('[data-id='+selectedId +']').toggle()
});

有了这个我就能实现我的目标。

但是，感谢那些对此主题提出意见的人。非常感激。：）

jquery匹配类

3 个答案: