0

マウスオーバーすると展開するようにしようとしていますが、Jquery Selectmenu plugin離れると再び閉じます。

andコマンドと一緒にMouseOverandイベントを使用することにしました。MouseOutopenclose

問題はそれがどのように機能するかです。div の外にある種の偽のメニューを作成しているように見えるので、オプションに移動するとすぐにメニューが再び閉じます。

これを JsFiddle で再現しました: http://jsfiddle.net/jc2bs/

これを機能させたいと思います。

また、クリックでアクティブ化された場合は閉じられますが、クリックでアクティブ化された場合は閉じるmouseoutことがmouseoverできれば幸いです（したがって、ユーザーがメニューをクリックすると、オプションを選択するか、外側をクリックするまで開いたままになります）。しかし、それは解決するのがはるかに難しいシナリオだと思います。

4

2 に答える 2

1

mouseleaveこれは、selectmenu 自体のイベントを使用してメニューを閉じることで実現できます。

$('.ui-selectmenu-menu').on('mouseleave', function() {
    $('#sel').selectmenu('close');
});

ライブ: http://jsfiddle.net/5wExe/1

2 番目の要件は理論的には可能ですが、個人的には良い考えではないと思います。メニューが表示されても、ユーザーはクリックしようとは思わないでしょうonmouseover。

于 2012-05-22T16:31:19.320 に答える
1

最初の（サブ）質問については、以下の解決策を使用できます。それは私にとってはうまくいきます：

$("body").on("mouseenter", "#sel-button", function() {
    $('#sel').selectmenu('open');
});

$("body").on("mouseleave", "#sel-button, #sel-menu", function() {
    if (!$('#sel-menu').is(':hover')) {
        $('#sel').selectmenu('close');
    }
});

それで、私がしたこと。まず、非推奨delegateのメソッドを新しいonメソッドに変更しました。次に、and の代わりに and イベントを使用しmouseenterましmouseleaveた(理由はドキュメントで確認できます)。サブメニューには、要素 ID を と連結して作成されたID () があると考えてください。セレクトボタンも同様です。mouseovermouseout#sel-menuselect"-menu"

デモ: http://jsfiddle.net/jc2bs/6/

2 番目の (サブ) 質問に関しては、いくつかのトリックを使用できます。メニューがクリックされた場合にフラグを保存するために使用dataし、これに基づいて、マウスを離したときにサブメニューを非表示にするかどうかを決定します。

デモ: http://jsfiddle.net/jc2bs/7/

于 2012-05-22T16:28:32.217 に答える