0

私は jquery を使用しているので、画像にカーソルを合わせると、Ajax 呼び出しからのデータを含むポップアップ div が表示されます。

IE と FF の両方でテストしていますが、DIV がうまく動作しません。基本的に、理由もなく（マウスを動かさずに）閉じています。場合によっては、ホバーオフ イベントが開始されたかのように感じられることがあります。フリックはあなたが使用できる用語だと思います。

Google で調べましたが、関連すると思われる情報が見つかりません。これがなぜなのか、誰にも考えがありますか？私のコードは以下の通りです：

JS

  $(document).ready(function() {
  $(".hover").hover(
  function(e){
    var ref = $(this).attr("wsref");
    var url = "https://site/_ref/shop/_base/order_status.php?action=getstatus&ref="+ref+"&sid="+Math.random();
    $("#status").show();
    var height = $(".status").height();
    var width = $(".status").width();
    leftVal = e.pageX - width -10 + "px";
    topVal = e.pageY - height -10 + "px";
    $("#status").css({left:leftVal,top:topVal});
    $("#status").html("<div id='loading'></div>").load(url);
  },
  function() {
    setTimeout('$("#status").hide()',1500);  
  });
});

HTML

<img class="hover" title="Order Received" name="Order Received" src="https://site/_ref/images/cart.png" wsref="002731"/>
4

2 に答える 2

0

これを試して

var isShowing;
isShowing=false;
$(document).ready(function() {
$(".hover").hover(
function(e){
if(!isShowing)
{
    var ref = $(this).attr("wsref");
   var url = "https://site/_ref/shop/_base/order_status.php?action=getstatus&    ref="+ref+"&sid="+Math.random();
    $("#status").show();
    var height = $(".status").height();
    var width = $(".status").width();
    $("#status").html("<div id='loading'></div>").load(url);
    isShowing=true;
}
leftVal = e.pageX - width -10 + "px";
topVal = e.pageY - height -10 + "px";
$("#status").css({left:leftVal,top:topVal});

},
function() {
setTimeout('$("#status").hide();',1500);  
});
});

非表示にした後、make isShowing = false; ステータス要素のスタイル属性の表示を調べることにより、isShowing変数を使用せずに実装することもできます。

于 2012-06-02T03:52:24.650 に答える
0

あなたの問題は、divが開いたときにトリガー画像から離れていることです。マウスがポップアップ上にある場合 (ポップアップはトリガー イメージの子ではないため)、トリガー自体で mouseOut としてカウントされます。そこでポップアップを閉じます。次に、マウスが再びトリガーの上にあると、トリガーが再び開きます。

$(document).ready(function() {
  $(".hover").mouseover(function(e){
        var ref = $(this).attr("wsref");
        var url = "https://site/_ref/shop/_base/order_status.php?action=getstatus&ref="+ref+"&sid="+Math.random();
        $("#status").show();
        var height = $(".status").height();
        var width = $(".status").width();
        leftVal = e.pageX - width -10 + "px";
        topVal = e.pageY - height -10 + "px";
        $("#status").css({left:leftVal,top:topVal});
        $("#status").html("<div id='loading'></div>").load(url);
      });
    $("#status").mouseout(function() {
        setTimeout('$("#status").hide()',1500);  
      });
  });
于 2012-06-02T04:06:05.277 に答える