2016-07-14 9 views
0

私のサイトでは、アイコンをクリックした後に浮動連絡先フォームが表示されます。マウスがコンタクトフォームを離れると、マウスは閉じた状態になります。それはうまく動作します。 問題は、Mozillaでは、コンテキストメニューから連絡先フォームにテキストを貼り付けたいときにフォームが閉じることです。右クリックし、「貼り付け」を選択して閉じます。それを避けるためにjQuery関数をどのように変更する必要がありますか?この問題はMozillaでのみ表示されます。jQuery mouseleave()とMozillaのコンテキストメニューの問題

そして、私のjQueryのは(それはおそらく非常に悪い書かれて、私はちょうど学び始めました):

<script type="text/javascript"> 
jQuery(document).ready(function($){  
     $('#order-icon').click(function() { 
      $('#floating-form').addClass("open"); 
     }); 

     $('#order-icon').mouseover(function() { 
       $(this).addClass("hover"); 
     }); 

     $('#order-icon').mouseleave(function() { 
      $(this).removeClass("hover"); 
     }); 

     $('#floating-form').mouseleave(function() { 
      $(this).removeClass("open"); 
     }); 

     $('#floating-form').contextmenu(function() { 
      $(this).addClass("open"); 
     }); 

     var body = $('body'); 
}); 
</script> 

浮動形式構造:

 <div id="floating-form"> 
      <div id="order-form"> 
       <!-- contact form --> 
      </div> 
      <div id="order-icon"> 
       <!-- icon --> 
      </div> 
     </div> 

は、事前にありがとうございます!

+0

このターゲットに異なる質問があります:[ブラウザのコンテキストメニューのクローズイベントがある](http://stackoverflow.com/questions/12801898が)と[jQueryのホバーメニューは右クリックすると消えます。](http://stackoverflow.com/questions/29693979)、どちらも信頼性がありません。 2番目のものも間違っている、 –

+0

主な問題は、IMHOは、コンテキストメニューが閉じられているかどうかを確認する信頼できる方法がないということです。それ以外の場合は、コンテキストメニューが開いたときにmouseleaveイベントのリッスンを停止し、リスナを閉じた後、マウスがまだ 'floating-form'内にあるかどうかを確認します。 –

答えて

0

サポートすべてのブラウザ(Firefoxの付属):

<html oncontextmenu="menuShow(event)" contextmenu="floating-form"> 

<script> 
function menuShow(e){ 
e.preventDefault(); 
$("#floating-form").addClass("open"); 
} 
</script> 
+0

OPが正しく理解されれば、ユーザーは過去のデータをフォームフィールドに使用することができます。 –

+0

はい、@ t.nieseが正しいです。このコードは残念ながら私にとってはうまくいきません。 – Dandy

関連する問題