Javascript 如何将选定索引数据指定给工具提示数据？

因此，我最终创建了一个可运行且可测试的示例。 到目前为止，我所做的是创建了两个按钮，当鼠标悬停在上面时，这两个按钮都会显示工具提示

当你点击一个按钮时，它允许你从

Select

元素中选择一个项目

事情是这样的

我想在相应的工具提示中显示有关所选项目的信息

因此，如果我单击按钮

headBtn

并选择第一个选项，那么我希望有关该选项的信息显示在鼠标悬停在该按钮上时显示的工具提示中

var theArray=[]；
函数getHeadData（）{
$（“#项选择”）.empty（）；
$.getJSON（“https://api.myjson.com/bins/lf0tc，函数（数据）{
对于（变量i=0；i

。工具提示{
位置：相对位置；
显示：内联块；
边框底部：1px点黑色；
}
.tooltip.tooltiptext{
可见性：隐藏；
宽度：120px；
背景色：黑色；
颜色：#fff；
文本对齐：居中；
边界半径：6px；
填充：5px0；
/*定位工具提示*/
位置：绝对位置；
z指数：1；
}
.tooltip:悬停.tooltiptext{
能见度：可见；
}
/*模态（背景）*/
.莫代尔{
显示：无；/*默认情况下隐藏*/
位置：固定；/*保持原位*/
z指数：1；/*位于顶部*/
填充顶部：100px；/*框的位置*/
左：0；
排名：0；
宽度：100%；/*全宽*/
高度：100%；/*全高*/
溢出：自动；/*根据需要启用滚动*/
背景色：rgb（0,0,0）；/*回退色*/
背景色：rgba（0,0,0,0.4）；/*黑色w/不透明度*/
}
/*模态内容*/
.模态内容{
背景色：#fefe；
保证金：自动；
填充：20px；
边框：1px实心#888；
宽度：80%；
}
/*关闭按钮*/
.结束{
颜色：#AAAAA；
浮动：对；
字号：28px；
字体大小：粗体；
}
.关闭：悬停，
.结束：聚焦{
颜色：#000；
文字装饰：无；
光标：指针；
}

将鼠标移到下面的文本上：

选择头盔
项目名称
图标
精选项链
项目名称
图标
&时代；
请选择一个项目

您可以这样做：

$('.tooltip').mouseover(function(event){
var index = $(".tooltip").index(this);
        switch (index) {
            case 0:
                //HeadItem

                break;

                case 1:
                //NeckItem

                break;

            default:
                break;
        }

        //NEW LINES
        $("#headBtn > .tooltiptext > h3.radio").html(theArray[index].Name;
        $("#headBtn > .tooltiptext > p.radio").html(theArray[index].Icon;
});

---

试试这个。我为headTip和neckTip添加了一个var。OnChange事件（我在模态显示上绑定的）我正在赋值。然后，我只是在那里替换h3

var theArray=[]；
头尖、颈尖；
函数getHeadData（）{
$（“#项选择”）.empty（）；
$.getJSON（“https://api.myjson.com/bins/lf0tc，函数（数据）{
对于（变量i=0；i