0

对于初学者，这是我的 php：

$id2 = mysql_real_escape_string($id2);
                $getdata8 = mysql_query("SELECT * FROM musicbook WHERE identify='$identify' ORDER BY id DESC LIMIT 20");
                $numrowsgetdata = mysql_num_rows($getdata8);
                if ((mysql_num_rows($getdata8))<1)
                {
                echo "<i>Be the first to say something?</i><p/>"; 
                }
                while ($row8 = mysql_fetch_assoc($getdata8))
                {
                $id8 = $row8['id'];
                $name8 = $row8['name'];
                $message8 = $row8['message'];
                $message10 = nl2br($message8);
                $date8 = $row8['date'];
                if ($name8==$username)
                {
                echo "
                <div class='messagediv' style='background:#1A1A1A;'><div style='padding:5px;'>$message10<br/>
                <div style='margin-top:4px; font-size:.8em; float:left;'><div style='float:left;'><a href='http://www.pearlsquirrel.com/$name8' style='color:white;'>$name8</a><font style='color:#D6D6D6'> on $date8</font></div>
                <input type='hidden' id='wpm2' value='$id8'><input type='button' id='deletelistenchat' class='deletelistenchat' style='display:none;' onclick='LinkOnClick2($id8); loadlistenchat();' value='(delete?)' /></div></div></div>
                ";
                }
                else
                {
                echo "
                <div class='messagediv'><div style='padding:5px;'>$message10<br/>
                <div style='margin-top:4px; font-size:.8em; float:left;'><div style='float:left;'><a href='http://www.pearlsquirrel.com/$name8' style='color:white;'>$name8</a><font style='color:#D6D6D6'> on $date8</font></div>
                </div></div></div>";
                }
                }
                if($numrowsgetdata >= 20)
                {
                echo "<div id='loadingcomments'><img src='loading.gif' style='height:30px; width:30px;'></div>";
                }
                ?>

这是我的jQuery：

$('.messagediv').live('mouseover mouseout', function(event) {
    if (event.type == 'mouseover') {
    document.getElementById('deletelistenchat').style.display='block';
    } else {
    document.getElementById('deletelistenchat').style.display='none';
    }
    });

现在我想要发生的是，当您将鼠标悬停在每个 .messagediv div 上时，它会显示删除按钮，#deletelistenchat。但是，它仅适用于每个 mysql 查询的最后一行，我希望悬停效果在用户悬停在每个查询上时都可以使用。例如，如果我将鼠标悬停在用户的第一个帖子上，悬停效果会在 mysql 查询检索到的最后一个帖子上激活。我一直试图弄清楚这一点已经有一段时间了，并且迷失了。帮助将不胜感激。

4

1 回答 1

1

ID 是唯一的。您一遍又一遍地使用相同的 ID，因此，DOM 只会找到具有该 ID 的最后一个元素——这是预期的效果，这是您编写 php.ini 的结果。

<input type='button' id='deletelistenchat'

从此按钮中删除 ID。你已经在这里上课了。

让我们改变你的悬停事件。

$(function(){
  $('.messagediv').on('mouseover', function() {
    $(this).find('.deletelistenchat').css('display', 'block');
  }).on('mouseout', function(){
    $(this).find('.deletelistenchat').css('display', 'none');
  });
});

*Edit*

DOM 行为没有按预期运行，因为我没有清楚地查看您的标记，这是我的错。让它成为 jQuery 1.7 的价值，并将你的 mouseover 和 mouseout 语句分开，以便能够清楚地看到它们。

工作小提琴-> http://jsfiddle.net/6MpX9/

于 2012-04-07T18:39:38.983 回答