jQuery-隐藏和显示<；部门>；关于唯一按钮悬停

我基本上只想根据使用jQuery滚动的按钮，用文本填充一个div。我不太确定哪里出了错

        $(".buttonSet").hover(function(){
        if $("#button_X".hover){
            $('.textPreview').show();
            document.getElementById("preview").innerHTML = 'TEST X';
        } if else $("#button_Y".hover) {
            $('.textPreview').show();
            document.getElementById("preview").innerHTML = 'TEST Y';
        } if else $("#button_Z".hover) {
            $('.textPreview').show();
            document.getElementById("preview").innerHTML = 'TEST Z';
        }
    },function(){
        $('.textPreview').hide();
    });

---

为什么不为每个按钮使用单独的悬停事件？它将简化您的代码并可能解决您的问题：

$("#button_X").hover(function(){
    $('.textPreview').show();
    document.getElementById("preview").innerHTML = 'TEST X';
});

$("#button_Y").hover(function(){
    $('.textPreview').show();
    document.getElementById("preview").innerHTML = 'TEST Y';
});

$("#button_Z").hover(function(){
    $('.textPreview').show();
    document.getElementById("preview").innerHTML = 'TEST Z';
});

---

您可以尝试一些更简单、更易于维护的方法。。。 在每个按钮中，为onmouseover和onmouseleave事件指定显示/隐藏div的函数。可以将不同的消息作为参数传递给函数

function ShowOutput(message){
   $('#output').show().text(message + ' was button hovered');
}

您的HTML看起来像：

<div id="buttonX" class="button" onmouseover="ShowOutput('X')" onmouseleave="$('#output').hide()">X</div>
<div id="buttonY" class="button" onmouseover="ShowOutput('Y')" onmouseleave="$('#output').hide()">Y</div>
<div id="buttonZ" class="button" onmouseover="ShowOutput('Z')" onmouseleave="$('#output').hide()">Z</div>
<div id="output"></div>

X
Y
Z

看一看我为你创造的这个小玩意儿：

---

如果您想使用jQuery代码，请确保将jQuery添加到html页面。

（a）出现了什么错误？（b） 你能在中发布一个工作示例吗？啊，这完全有帮助！现在，当用户不使用按钮时，您如何处理隐藏按钮？啊，我不知道onmouseleave的东西在哪里。我要用这个。非常感谢。