javascript - マウス操作で要素を表示/非表示にする簡単な方法はありますか?

Question

ここにこのコードのセグメントがあります。これは、常に似たようなものを使用しているようです。

$(".fieldv").live('mouseenter', function() {
    $(this).children('.edit-icon').show();
}).live('mouseleave', function() {
    $(this).children('.edit-icon').hide();
});

要素をホバリングするかクリックするかに関係なく、マウスアクションで要素を表示/非表示にする、より簡単でシンプルでクリーンな方法はありますか? とか、そういうの...

Answer 1

JavaScript を使用する理由

デフォルトでアイコンを非表示にする必要があります。

.fieldv .edit-icon { display: none; }

次に、この CSS がホバー時に適用されます (ホバー時のみ)。

.fieldv:hover .edit-icon { display: block; /* or inline, etc. */ }

Answer 2

これを試すことができます：

       $(".fieldv").hover(function(){

              //mouseover

       ,function(){

              //mouseout
       });

Answer 3

$(".fieldv").hover(function() {
        $(this).children('.edit-icon').show();
    }, function() {
        $(this).children('.edit-icon').hide();
 });

$(".class").hover(function(){}, function(){}); を使用します。