0 
$('body').on('mouseover mouseout', '*:not(.printToolBar)', function (e) {
    if (this === e.target) {
        (e.type === 'mouseover' ? setMenuBox(e.target) : removeMenuBox(e.target));
    }
});

function setMenuBox (obj){
    $(obj).wrap('<div class="toolBarWrapper" style="position:relative;"/>');
    $(".toolBarWrapper").append($('.printToolBar'));
}

function removeMenuBox (obj){
    $(".toolBarWrapper").remove('.printToolBar');
    $(obj).unwrap();
}

function createToolBar(){
    var ul = $("<ul>").attr({
        'class': "printToolBar",
        style: "border: 1px solid #ff0000; position:absolute; top:0 ; right: 0;"
    });
    var li = $("<li>").attr({
        'className': "printToolBarList"
    }).text('Print');
    var printLi = li.clone().attr({
        id: "print"
    }).on('click',function(e){ 
        console.log(this);
    });     
    ul.append(printLi).appendTo("body");
};
createToolBar();

これは、すべての HTML 要素でメニューバーを設定しようとしていることですが、JS エラーをスローして問題を引き起こしているメニューバー自体のイベントを切り離すことができません。同じことを達成する他の方法はありますか?

4

1 に答える 1

1

ul 要素の「ホバー」動作を削除するには、最初のコード行を更新する必要があると思います:

$('body').on('mouseover mouseout', '*:not(.printToolBar), *:not(ul)', function (e) {
     if (this === e.target) {
        (e.type === 'mouseover' ? setMenuBox(e.target) : removeMenuBox(e.target));
     }
});

このようにして、ul と .printToolbar 以外のすべての要素に mouseevent をアタッチします。

編集 ：

UL 子の添付ファイルを削除するには:

$('body').on('mouseover mouseout', '*:not(ul.printToolBar), *:not(ul.printToolBar >    *)', function (e) {
    if (this === e.target) {
       (e.type === 'mouseover' ? setMenuBox(e.target) : removeMenuBox(e.target));
    }
});
于 2012-11-27T09:30:05.913 に答える