Question

这是标签内的onclick侦听器

onclick="showMap('change-img-box',event); return false;"

这是jquery

function showMap(id,e){
var hpos = e.pageX, ypos = e.pageY; alert(hpos+'----'+ypos);
if($("#"+id).is(":visible")){
    $("#"+id).hide();
}else{
    $("#"+id).css({"top": ypos+10, "left": hpos+10}).hide().fadeIn(300);
}
}

不确定原因，但IE 7表示hpos和ypos都未定义。我怎样才能解决这个问题。提前谢谢。

Answer 1

较早版本的IE使用clientX和clientY代替。这是我用于跨浏览器兼容性的功能：

window.getMouseCoords = function(e) {
    if( !e) return {x:0,y:0};
    if( e.pageX || e.pageY) {
        return {x:e.pageX,y:e.pageY};
    }
    if( e.clientX || e.clientY) {
        return {
            x:e.clientX+document.body.scrollLeft+document.documentElement.scrollLeft,
            y:e.clientY+document.body.scrollTop+document.documentElement.scrollTop
        };
    }
    return {x:0,y:0};
};

Answer 2

由于您已经使用了jquery，因此可以使用jquery而不是inline onclick初始化click事件。 jQuery根据W3C标准（http://api.jquery.com/category/events/event-object/）

规范化事件对象

$('#thing-you-are-clicking').click( function(e) {
    var hpos = e.pageX, ypos = e.pageY;
    // Do your stuff here...
});

如果您需要'id'数据，可以使用data- *属性将其放入按钮的dom中，例如

<a href="#" id="thing-you-are-clicking" data-id="change-img-box">Hi</a>

然后您可以使用.data（'id'）

访问数据

$('#thing-you-are-clicking').click( function(e) {
    var hpos = e.pageX, ypos = e.pageY;
    var id = $(this).data('id');
    // Do your stuff here...
});

在IE7中未定义event.pageX和event.pageY

2 个答案: