javascript - anchor 标记事件未触发

Question

我的问题是我的 anchor onclick 事件没有触发。这是我的 jquery 代码

这是一个页面加载事件

function pageLoad() {

我在 anchor 上绑定(bind)上下文菜单事件

$('#ctl00_ContentPlaceHolder1_gvParamShow a').bind("contextmenu", function(e) {
    // alert('event fired');
    e = jQuery.event.fix(e);

    $('#contextMenu').parent().css('position', 'absolute');
    $('#contextMenu').css('borderColor', 'Black').css('borderStyle', 'Solid').css('borderWidth', '1px').css('backgroundColor', '#EEEEEE').css('color', 'Black');
    $('#contextMenu').show();
    //alert('appended');
    var mouseX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
    var mouseY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;

    document.getElementById('contextMenu').style.top = mouseY + 'px';
    document.getElementById('contextMenu').style.left = mouseX + 'px';
    return false;
});

这里是问题区，看代码末尾的解释

$('*').not($('.anchorClass')).mousedown(function() {
    if ($(this).is('a')) {
    }
    else {
        $('#contextMenu').hide();
    }

});
}

点击 anchor 时触发的事件

function showLiveTrack() {
    alert('hey');
    return false;
}

这是我的上下文菜单代码

<div id="contextMenu">           
            <div><a onclick="showLiveTrack();" class="anchorClass">Show Live Track</a></div>
            <div><a class="anchorClass">Bhuwan</a> </div>
            <div><a class="anchorClass">Bhuwan</a> </div>
            <div><a class="anchorClass">Bhuwan</a> </div>          
</div>

我的问题的解释:

我想在上下文菜单 anchor 单击时触发 showLiveTrack() 函数。另外，我想让上下文菜单在用户单击屏幕上的其他任何地方时消失。我已经尝试了我想到的所有可能的方法，但我无法触发这个 anchor 事件。相反，它使上下文菜单消失。为什么？

如果我删除下面的代码

$('*').not($('.anchorClass')).mousedown(function() {
    if ($(this).is('a')) {
    }
    else {
        $('#contextMenu').hide();
    }

});

然后事件被触发..

我做错了什么？？？

Answer 1

我做了这个 jsfiddle 来尝试解决你的问题:http://jsfiddle.net/fFs4j/1/

看到我为 body 和 #contextMenu 附加了单独的点击监听器。如您所见，我通过检查目标来检查是否在 $('body').click 监听器中单击了 #contextMenu。

这就是你要找的吗？