取消绑定右键单击jquery

时间:2013-08-14 18:59:17

标签: javascript jquery jquery-ui

我尝试使用unbind方法取消绑定类'.rightclickarea'的元素。

   $('.rightclickarea').unbind();

         $('.rightclickarea').bind("contextmenu",function(e){
             e.preventDefault()
             });

但该元素并未解除对事件的限制。所以每当我调用此方法BindBookMarkPopUp()时,它会再次尝试绑定,这会产生问题。那么有什么方法可以在jquery中的每个绑定之前解除绑定。谢谢!

function BindBookMarkPopUp() {


$('.rightclickarea').unbind("contextmenu");

$('.rightclickarea').bind('contextmenu', function(e) {

    id = $(this).attr("id");

    $("#current_id").html(id.substring(3));
    $("#current_id").attr("data-type",1);

    var $cmenu = $(".vmenu_bookmark");
    $('<div class="overlay"></div>').css({
        left : '0px',
        top : '0px',
        position : 'absolute',
        width : '100%',
        height : '100%',
        zIndex : '100'
    }).click(function() {
        $(this).remove();
        $cmenu.hide();
    }).bind('contextmenu', function() {
        return false;
    }).appendTo(document.body);
    $(".vmenu_bookmark").css({
        left : e.pageX,
        top : e.pageY,
        zIndex : '101'
    }).show();
    return false;
});

$('.vmenu_bookmark .first_li').live('click', function() {
    if ($(this).children().size() == 1) {
        alert("book_marks");

        if ($(this).attr("id") == "vmenu_bookmark") {
            $.colorbox({
                inline : true,
                width : 280,
                height : 120,
                href : "#title_content",
                title : "Enter title for Bookmark"
            });

        }
        $('.vmenu_bookmark').hide();
        $('.overlay').hide();
    }
});


$('.vmenu_bookmark .second_li').live('click', function() {


    if ($(this).children().size() == 1) {

        if ($(this).attr("id") == "vmenu_project") {

        alert("project_click")
            PopulateProjects();

            $.colorbox({
                inline : true,
                width : 500,
                height : 400,
                title : "",
                href : "#title_content_project"

            });


        }

        $('.vmenu_bookmark').hide();
        $('.overlay').hide();
    }
});

HTML代码:

<div class="vmenu vmenu_bookmark">
            <div class="first_li" id="vmenu_bookmark"><span>Add to Bookmark</span></div>
            <div class="second_li" id="vmenu_project"><span>Add to Project</span></div>
            <div style="display: none;" class="sep_li"></div>

            <div style="display:none;" class="first_li"><span>XYZ</span>
                <div class="inner_li">
                    <span>ABC</span> 
                    <span>PQR</span>
                    <span>MNO</span>
                </div>
            </div>
    </div>

1 个答案:

答案 0 :(得分:1)

unbind方法反转(删除)先前绑定的事件处理程序。您不能事先unbind处理尚未绑定的处理程序。

如果您希望取消绑定某个事件处理程序,请随后执行此操作。例如,为了取消绑定所有先前绑定的contextmenu事件,您可以执行以下操作:

$(".rightclickarea").unbind("contextmenu")

您也可以取消绑定所有类型的所有先前绑定事件,只是不提供参数:

$(".rightclickarea").unbind()

最后,如果您只想取消绑定特定的事件处理程序,您有两个选项(这两个选项都要求您在第一次绑定时采取不同的行为):

选项1

使用namespace绑定方法,例如:

$(".rightclickarea").bind("contextmenu.myUniqueHandler", function() {
   /* your code here */
})

然后您可以使用以下方法取消绑定此特定事件处理程序:

$(".rightclickarea").unbind("contextmenu.myUniqueHandler")

选项2

您附上回调函数并将其存储在变量中,然后将其传递给bind方法:

var myUniqueHandler = function() {
   /* your code here */
}

$(".rightclickarea").bind("contextmenu", myUniqueHandler)

然后使用上述变量解除绑定:

$(".rightclickarea").unbind("contextmenu", myUniqueHandler)

编辑:

深入解决您的问题(在进一步说明之后),在多次调用.vmenu_bookmark后,您实际上遇到了BindBookMarkPopUp一次多次触发的问题。

问题是你假设在unbind上使用.rightclickarea将反转在回调函数内完成(或绑定)的任何事情。它不是。

当您使用unbind时,只会阻止您的绑定功能执行任何进一步的操作:

// this will not execute after an unbind:
$('.rightclickarea').bind('contextmenu', function(e) {

    // ....
    // some code
    // ...
    // ..

    // VVV This will not unbind, it will still work. VVV
    $('.vmenu_bookmark .first_li').live('click', function() { 
       /// ...
    })
})

您执行的所有操作都不会在解除绑定后反转 - 包括.live / .bind次来电。

这意味着每次调用BindBookMarkPopUp都会向bind添加另一个事件处理程序(.vmenu_bookmark),导致它们堆积起来。

解决方案是将您的所有.bind().live()来电(包括.vmenu_bookmark....rightclickarea)移至功能外的 * *

您没有理由多次绑定 - 您只需要执行一次。