0

jQuery タスクに問題があります。リンクをロールオーバーするときに「«」記号を表示しようとしています。問題は、一度に「ロールオーバー」できるリンクは 1 つだけですが、「«」がすべてのリンクに表示されることです。

コードは次のとおりです。

$(".list td a").hover(
  function() { $(".laquo").show(); },
  function() { $(".laquo").hide(); }
);

したがって、私が理解しているように、「.list td」内の「a」要素をロールオーバーした後、私のクラス「.laquo」が表示されるはずです。これはうまく機能しています。しかし、一度に 1 つの 'a' だけをターゲットにするように jQuery に指示するにはどうすればよいでしょうか?

同様の質問から解決策を試しました：

function() { $(".laquo", this).show(); },

しかし、それは機能していません-「«」はまったく表示されません。私は何を間違っていますか？

HTML で編集:

<div class="list">
    <table>
        <tr>
            <td class="left">1.</td>
            <td>
                <a href="index.html">Circles</a>
                <span class="laquo" style="display:none;">&nbsp;&laquo;</span>
            </td>
        </tr>
    </table>
</div>

ご覧のとおり、「.laquo」は「a」の子ではありません。じゃあどうやって選ぶの？

ああ、私はそれを手に入れました:D. 「a」を削除する必要があったので、「td」から選択しています。

みんな助けてくれてありがとう！

4

3 に答える 3

1

.laquoがの子である場合、コンテキストとしてacurrentを使用します。a

$(".laquo",this).show();

そうでない場合は、関連する要素のHTMLを確認する必要があります。

于 2013-01-20T21:19:13.687 に答える
1

.laquo要素がリンク要素の子であると仮定します。

$(".list td a").hover(function(){
    $(this).find('.laquo').toggle();
});
于 2013-01-20T21:19:47.173 に答える
0

あなたのコードは根本的に正しいので、あなたが示していないコードで何かを台無しにしただけだと思います.

ホバー コードの例

$(".list td a").hover(function(){
  $(".laquo", this).show();   
}, function(){
  $(".laquo", this).hide();  
});

それが機能しているJS Fiddleへのリンク

ただし、理想的には、このタスクは Javascript ではまったく実行しないでください。これは、:hover 疑似セレクターを使用して純粋な CSS で簡単に実装できるためです。

純粋な CSS での JSFiddle へのリンク

于 2013-01-20T21:26:19.263 に答える