BlockUI滚动到顶部

Question

我使用的是JQuery BlockUI插件：

function block(msg) {
    $.blockUI({
        message: msg,
        css: {
            border: 'none',
            padding: '15px',
            backgroundColor: '#000',
            '-webkit-border-radius': '10px',
            '-moz-border-radius': '10px',
            opacity: .8,
            color: '#fff'
        }
    });
}

function unblock() {
    $.unblockUI();
}

我面临的问题是，一旦我调用它，它就会将我的页面滚动到顶部。这不好。

这是生成的html：

有什么我可以修改的，以便它不会触及页面偏移/滚动吗？我能做些什么来保存它或什么？

由于

在这里打电话：

function callBump(realid) {

    block('Bumping...');

    $.ajax({
        type: "POST",
        url: "CalendarServices.aspx/Bump",
        data: 'id=' + realid,
        success: function (data) {
            $('#calendar').fullCalendar('refetchEvents');
            unblock();
        }
,
        error: function () {
            unblock();
        }
    });
}

Answer 1

我猜测跳到顶端是由于有这样的事情：

<a href="#" id="do_bump">Bump!</a>

无论您绑定到该链接的任何点击事件是否正在执行，但它继续尝试导航到导致跳转的“＃”。

可以通过捕获事件参数（将e添加到您的点击事件处理程序）并在其上调用preventDefault()来修复它。这可以防止发生默认链接点击行为，即导航到href属性值。

鉴于你的意见，你有这个：

$(btnBump).off('click'); 
$(btnBump).on('click', function () { 
    callBump(event.realid); 
});

event来自哪里？这是window.event吗？假设jQuery可能会破坏您的事件，请尝试此操作（您只需添加事件参数e）：

$(btnBump).on('click', function(e) {
    callBump(event.realid);
    e.preventDefault();
});