Javascript PHP中的jQuery工具提示；而"；循环不工作_Javascript_Jquery_Tooltip_Jquery Tools

Javascript PHP中的jQuery工具提示；而"；循环不工作

javascript jquery

Javascript PHP中的jQuery工具提示；而"；循环不工作,javascript,jquery,tooltip,jquery-tools,Javascript,Jquery,Tooltip,Jquery Tools,我想在我的网站上显示工具提示，我正在使用以下代码：我正在使用while循环创建表行。下面是我的工具提示的样子： <td class="maandgem">€ <?= round($monthavg, 2); ?></td> <div id="tooltip" class="tooltip"> Shipping: <?= $row['price_shipping']; ?><br /> Pr

我想在我的网站上显示工具提示，我正在使用以下代码：

我正在使用while循环创建表行

。下面是我的工具提示

的样子：

<td class="maandgem">&euro; <?= round($monthavg, 2); ?></td>
<div id="tooltip" class="tooltip">
    Shipping: <?= $row['price_shipping']; ?><br />
    Price: <?= $row['price']; ?><br /><br />
    Total: <?php echo $row['price'] + $row['price_shipping'] + ($row['abo_price'] * $row['abo_time']); ?>
</div>

我还包括了这个.js，我有一个工具提示的基本样式表

<script src="http://cdn.jquerytools.org/1.2.6/full/jquery.tools.min.js"></script>

我想这是因为您在工具提示中使用id，并且id必须是唯一的，因此jquery只选择第一个id

尝试改用class属性，然后选择它。

我想这是因为工具提示使用id，id必须是唯一的，因此jquery只选择第一个

尝试改用class属性，并选择它。

是的，如果将使用class而不是ID，则它也将在循环中工作。我已经测试过了，效果很好

    <link rel="stylesheet" href="jquery-ui-1.10.4.custom.css">  
    <script src="jquery-1.10.2.min.js"></script>  
    <script src="jquery-ui-1.10.4.custom.js"></script>  

    <script> 
        $(function() {   
            $( ".show-option" ).tooltip({     
                show: 
                {       
                    effect: "slideDown",     
                    delay: 250      
                },

                position: 
                {       
                    my: "center top",        
                    at: "center"      
                } 
            });   
        });  
    </script>
</head>
<body>
    <h2 class="show-option" title="Testing Tooltip">ToolTip</h2>
</body>


$（函数（）{
$（“.show option”）。工具提示（{
展示：
{       
效果：“向下滑动”，
延误：250
},
职位：
{       
我的：“中顶”，
在“中心”
} 
});   
});  
工具提示

是，如果将使用类而不是ID，则它也将在循环上工作。我已经测试过了，效果很好

    <link rel="stylesheet" href="jquery-ui-1.10.4.custom.css">  
    <script src="jquery-1.10.2.min.js"></script>  
    <script src="jquery-ui-1.10.4.custom.js"></script>  

    <script> 
        $(function() {   
            $( ".show-option" ).tooltip({     
                show: 
                {       
                    effect: "slideDown",     
                    delay: 250      
                },

                position: 
                {       
                    my: "center top",        
                    at: "center"      
                } 
            });   
        });  
    </script>
</head>
<body>
    <h2 class="show-option" title="Testing Tooltip">ToolTip</h2>
</body>


$（函数（）{
$（“.show option”）。工具提示（{
展示：
{       
效果：“向下滑动”，
延误：250
},
职位：
{       
我的：“中顶”，
在“中心”
} 
});   
});  
工具提示

谢谢您的回复。我该怎么做呢$（document）.ready（function（）{$（“.maandgem”）.tooltip（{tip:'.tooltip'，位置：'bottom left'，delay:0}）；}）@Linkjuice57是的，我想可以。@Linkjuice57您想在工具提示中显示什么？根据文档，您需要在.tooltip div上具有title属性，该属性包含要在工具提示中显示的文本。感谢您的回复。我该怎么做呢$（document）.ready（function（）{$（“.maandgem”）.tooltip（{tip:'.tooltip'，位置：'bottom left'，delay:0}）；}）@Linkjuice57是的，我想可以。@Linkjuice57您想在工具提示中显示什么？根据文档，您需要在.tooltip div上具有title属性，该属性包含要在工具提示中显示的文本。