php - jqueryホバーの作り方

Question

Twitterのreplaのリツイートやお気に入りのように、マウスが上にあるときhoverに表示するjQueryを作成するにはどうすればよいですか?div

ここに私のHTMLがあります：

<div style="display:none;" id="blab">
  <?php echo $blab_id; ?>
</div>
<a href="blab.php?id=<?php echo $blab_id; ?>">
    <div class="blab_body" id="hover" value="Hide">
        <table>
            <tr>
                <td valign="top">
                    <img src="<?php echo $profile_pic_info; ?>" class="blab_image" width="50" height="50" />
                </td>
                <td>&nbsp;</td>
                <td>
                    <table>
                        <tr>
                            <td valign="top">
                                <a href="profile.php?id=$mem_id">
                                    <strong><?php echo $added_fullname; ?></strong>
                                </a>
                                <?php echo $added_to_fullname; ?>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <?php echo $blab_body; ?>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <text style="color:gray;">
                                    <?php echo $blab_date; ?>|<?php echo $device; ?>
                                </text>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <div style="background:#000; display:none;" id="id">&nbsp;</div>
    </div>
</a>
<hr />

ここに私のJavaScriptコードがあります:

$('#id').hide();

$('#hover').hover(function () {
    var blab_id = $('#blab').text();
    $('#id').show();
}, function () {
    $('#id').hide();
});

div最初の 1 つだけを表示します。

Answer 1

ページ全体で特定の ID を使用できるのは 1 回だけです。このコピーをページに複数挿入するdivと、HTML コードが無効になります。そのため、jQuery はイベント ハンドラーを最初の要素にのみアタッチします。

解決策は、同じクラスを複数の要素に追加することが許可されているため、class="hover_enabled"代わりに使用することです。id="hover"jQuery で行う方法は次のとおりです。

$('.hover_enabled').hover(function() { ...

についても同様です#id。