javascript - if 条件检查两个选择器是否悬停，如果悬停，则文本行下划线

Question

简化更新，没关系使用变量。(最初的问题是使用一个选择器作为变量并执行此操作)

本质上为什么下面不起作用。

注意::未声明 || 时又名第二个选择器，这个工作很好。但是然后它所做的是不允许曾经的CSS自然:hover方法，所以这就是为什么我首先尝试在此处添加第二个选择器的原因。 我需要将鼠标悬停在图像上，然后查看相应的文本链接 hover ，并且我还需要单独将鼠标悬停在相应的文本链接上以获得 hover下划线效果。 如果无法使用 CSS/sass 或使用 :hover 来完成此操作，请提供有关如何到达这里的任何建议。在 jQuery 中作为一个稳定的选择？

setInterval(function(){
    if $("#t1").is(":hover") || $(".thumba").is(":hover")) {
       $(".thumba").css("text-decoration", "underline");
    }
    else {
       $(".thumba").css("text-decoration", "none");
    }
}, 200);

setInterval(function(){
    if $("#t2").is(":hover")) || $(".thumbb").is(":hover")) {
       $(".thumbb").css("text-decoration", "underline");
    }
    else {
       $(".thumbb").css("text-decoration", "none");
    }
}, 200);

---

另一个例子:

你有一个图像，比如说图像 a。)

<img src=" [图片a] ">

然后你有一个带有一些文本的段落:

<div >blahblahloremipsum <a href="#"> 点击此处 </a> blachhhhhhh </div>

我想将鼠标悬停在图像 a 上并允许单击此处有下划线，我想“悬停”并且下划线消失。我还希望不仅在图像上如此，而且作为文本链接的标准，基本上，如果您将鼠标悬停在单击此处而不是图像上，它仍然会下划线。

另一次尝试:(但鼠标不再悬停后下划线不会取消附加)

$(document).mousemove(function() {    
    if($('#t1').is(':hover') || $('.thumba').is(':hover')) {
        $('.thumba').css({'text-decoration':'underline'});
    }
    else {
        $('.thumba').css({'text-decoration':'none'});
    }
});

$(document).mousemove(function() {    
    if($('#t2').is(':hover') || $('.thumbb').is(':hover')) {
        $('.thumbb').css({'text-decoration':'underline'});
    }
    else {
        $('.thumbb').css({'text-decoration':'none'});
    }
});

看一下:这里(下面的链接)描述了在一个实例中使用它，这就是为什么它可能对我来说失败并且不是解决方案；但我在这个线程上没有看到多个解决方案。“(这只在选择器仅匹配 1 个元素时有效 - 请参阅编辑 3 了解更多)”

Detect IF hovering over element with jQuery

Answer 1

您需要在末尾添加另一个括号，并在第一个条件后删除一个括号:

if($thumbone.is(":hover") || $('.thumba').is(":hover")) {

您可能想引用这个问题来检查悬停:

Jquery condition check is(':hover') not working