1

我正在使用确认对话框作为是否从页面中删除一些元素的是/否确认。那部分工作正常。问题是在单击“确认”或“取消”后，页面会滚动到顶部。我怎样才能阻止这种行为？

$('.deleter').click(function () {
    if (confirm('Do you want to remove' + $(this).attr('name') + '. This action can not be undone.')) {
        $('.g' + $(this).attr('itemId')).remove();
        $('.' + $(this).attr('itemId')).remove();
    }
});

如果做不到这一点，将窗口设置回其先前空间的解决方法就可以了。

编辑：HTML代码

<a href='#' class='deleter' name='eg' itemId='4'>delete</a>

谢谢阅读

4

5 回答 5

7

它实际上是跳转到该位置#（的默认行为a）。您需要通过preventDefault().

尝试这个，

$('.deleter').click(function (e) {
    e.preventDefault();
    if (confirm('Do you want to remove' + $(this).attr('name') + '. This action can not be undone.')) {
        $('.g' + $(this).attr('itemId')).remove();
        $('.' + $(this).attr('itemId')).remove();
    }
});
于 2013-08-29T04:46:31.850 回答
2

阿尼尔是正确的。您的链接告诉它转到页面顶部：

<a href='#' class='deleter' name='eg' itemId='4'>delete</a>

如果您不希望您的链接像一个实际的锚链接，那么：

一个。不要让它成为一个链接。将点击事件绑定到不同类型的对象（例如按钮）

或者

湾。给 href 一个适当的 null 值，例如 javascript：

 <a href='javascript:;' class='deleter' name='eg' itemId='4'>delete</a>
于 2013-08-29T04:52:43.817 回答
1

这是因为锚标签而发生的。像这样更改锚标记更改 ** href="#_" **

<a href='#_' class='deleter' name='eg' itemId='4'>delete</a>
于 2013-08-29T05:01:37.387 回答
1

听起来您将事件绑定到锚元素，其默认行为是导致对资源的 GET。以下将阻止锚点的默认行为：

$('.deleter').click(function (e) { 
    e.preventDefault();

    if (confirm('Do you want to remove' + $(this).attr('name') + '. This action can not be undone.')){
    $('.g' + $(this).attr('itemId')).remove();  
    $('.' + $(this).attr('itemId')).remove();
    } 
});

或者：

$('.deleter').on('click', function (e) {
    e.preventDefault();

    if (confirm('Do you want to remove' + $(this).attr('name') + '. This action can not be undone.')){
    $('.g' + $(this).attr('itemId')).remove();  
    $('.' + $(this).attr('itemId')).remove();
    } 
});
于 2013-08-29T04:45:50.887 回答
0

Confirm, Alert and Prompt are browser dependant functionalities actually. We cant change its behaviour or design. Or else you want to use jquery plugins for dialogs rather than these. Refer this, http://labs.abeautifulsite.net/archived/jquery-alerts/demo/

于 2013-08-29T05:08:43.717 回答