[英]jquery Hover and while loop
I have a table of php with while loop to show the records. 我有一个带有while循环的php表来显示记录。
I added a jQuery hover handler to do that, if hovered it show a message in same row but the problem is, if hover it show a message in all rows. 我添加了一个jQuery悬停处理程序来执行此操作,如果悬停它在同一行显示一条消息,但问题是,如果悬停它在所有行中显示一条消息。
Here is the css: 这是css:
<style>
.tansa{
position: absolute;
margin-right: -60px;
margin-top:-25px;
background: #CBDFF3; border: 1px solid #4081C3; font-size: 0.88em;
padding: 2px 7px; display: inline-block;
border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;
line-height: 1.2em;
text-shadow: 0 0 0em #FFF;
overflow: hidden;
text-align: center;
color:black;
display:none;
}
.arrow{
position: relative;
width: 0;
height: 0;
top: -25px;
border-top: 5px solid #000000;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
display:none;
}
</style>
Here is my php: 这是我的PHP:
<table><tr>row</tr>
<?php
$results = mysql_query("select * from MyTable");
while{$r = mysql_fetch_array($results)){
echo "<tr><td>Row : <img src='img/tans.png' width='24' height='24' class='tansef' /><span class='tansa' >the message</span><div class='arrow'></div></td></tr>";
}
?>
</table>
Here is jquery 这是jquery
$(document).ready(function(){
$('.tansef').hover(function(){
var sh = $('.tansa');
var sharrow = $('.arrow');
sh.show();
sharrow.show();
}, function(){
var shs = $('.tansa');
var sharrows = $('.arrow');
shs.hide();
sharrows.hide();
});
});
Any solution to show the message in each row only? 任何只在每一行显示消息的解决方案?
Try changing: 尝试改变:
var sh = $('.tansa');
var sharrow = $('.arrow');
to: 至:
var sh = $(this).siblings('.tansa');
var sharrow = $(this).siblings('.arrow');
(as well as the equivalent shs and sharrows variables). (以及等效的shs和sharrows变量)。 Your code is referencing all elements with a specific class instead of those elements relative to the one being hovered over by using
this
. 您的代码引用了具有特定类的所有元素,而不是相对于使用
this
元素悬停的元素。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.