4

なぜこれは要素ごとに機能するのですか?

<script>
$(document).ready(function(){
  $("p").click(function(){
    $(this).hide();
  });
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>

それぞれクリックすると消えます。

しかし、ホバーでコーディングすると..

<script>
$(document).ready(function(){
  $("p").hover(function(){
    $(this).hide();
  });
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>

それらはすべて一緒に消えます。違いは何ですか？

4

5 に答える 5

6

これは、最初の<p>要素の上にカーソルを合わせるとその要素が消え、2 番目の<p>要素が上に移動してその場所に移動するためです。このプロセスは、すべての要素が非表示になるまで繰り返され<p>ます。これは、マウスが常に要素の上に置かれているためです。

于 2013-09-22T18:22:39.053 に答える
4

一番下の要素にカーソルを合わせてみてください。正しい要素だけが削除されます。

それらをすべて削除していると思う理由は、一番上のものを削除してから一番上に移動し、それらすべてを非常に迅速に順次削除するためです。

于 2013-09-22T18:22:30.723 に答える
2

問題は、それぞれpが削除されると、次pのものがマウスの下に移動することです。最初に一番下にカーソルを合わせると、<p>その 1 つだけが削除されていることがわかります。

スクリプトに問題はありません。フィドル: http://jsfiddle.net/zXKGk/

于 2013-09-22T18:23:14.993 に答える
1

各要素はさらに上に移動するため、次にマウスをその要素に合わせて削除します。これを軽減するために、非表示のまま同じスペースを保持することで、新しい要素をさらに上に移動することを避けることができます。

$("p").hover(function () {
    $(this).css("visibility", "hidden");
});

http://jsfiddle.net/JqXwv/

于 2013-09-22T18:25:47.623 に答える
0

下のタグからホバーしてみるとp、テイクに異常がないことがわかります。下のタグをホバリングpすると上に移動して最初の場所になるため、タグが消えますがp、実際には気づきにくいです。p各タグでイベントをコンソールに記録してみることができます。

http://jsbin.com/OpIpOpO/1/edit?html、出力

于 2013-09-22T18:25:23.307 に答える