0

私は PHP でカレンダーを生成しています。Ajax リクエストから (jQuery 経由で) 収集されたデータを使用して、毎日のツールチップを表示したいと考えています。

私はそれをしましたが、マウスカーソルであまりにも速くナビゲートしようとすると奇妙なエラーが発生します. 一部のツールチップがスタックします。それを修正する方法はありますか?

DIVこれが毎日の私のコードです:

<div style="-moz-border-radius:8px; border-radius: 8px;" 
   class="pusty" id="dzien_'.$day.'"  
   onclick="idz_do_dnia('.$day.','.$miesiac.','.$rok.','.$gildia[id_gildi].')" 
   onmouseover="zaznacz('.$day.','.$data_s.','.$data_k.','.$gildia[id_gildi].')" 
   onmouseout="odznacz('.$day.')" > 
   &nbsp; 
</div>

そして、tooltim を表示する (名前: zaznacz) およびそれらを非表示にする (名前: odznacz) 2 つの JavaScript 関数を次に示します。

function zaznacz(id,data_s,data_k,gildia)
{
    jQuery("#dzien_"+id).removeClass("pusty");
    jQuery("#dzien_"+id).addClass("zaznaczony");

    jQuery.ajax(
    {
        url: '/raidplanner_mini.php?data_s='+data_s+'&data_k='+data_k+'&gildia='+gildia,
        success:function(data)
        {
            if (!jQuery("#dzien_"+id).hasClass("tooledUp"))
            {
                jQuery("#dzien_"+id).tooltip(
                {
                    content: data,
                    show: false,
                    tooltipClass: "tooltip",
                    hide: false,
                    track: false,
                 }); 
                jQuery("#dzien_"+id).tooltip("open");
                jQuery("#dzien_"+id).addClass("tooledUp"); 
            }
            //else
          //jQuery("#dzien_"+id).tooltip().show();
        }   
    });
}
function odznacz(id)
{
    jQuery("#dzien_"+id).removeClass("zaznaczony");
    jQuery("#dzien_"+id).addClass("pusty");
}

それを機能させる方法はありますか?

4

1 に答える 1

0

そのバグはここで追跡されています: http://bugs.jqueryui.com/ticket/8740

Chrome 拡張機能で次の回避策を使用しました。次のように、jQueryUI ツールチップの初期化に open のハンドラーを追加しました。

    open: function() {
        $(this).one('mouseout.wpcustom', function() {

            $(this)
                .off('mouseout.wpcustom')
                .tooltip('disable')
                .tooltip('enable');
        });
    }

これにより.tooltip('disable')、マウスアウト イベントで ( を使用して) ツールチップが強制的に閉じられます。ここで完全なコードを参照してください: https://github.com/jncornett/wiki-preview/blob/master/src/js/inject.js

于 2014-03-14T15:57:28.187 に答える