按钮只是用户顶部

Question

我有删除按钮。 通过单击它，我运行从数据库中删除数据的 Ajax 代码。

当我单击按钮时，用户屏幕会跳到页面顶部。 我怎样才能防止这种情况发生？

我希望用户在删除框时停留在同一个地方......

.HTML

<article class="row fadeSec" id="60">
<a href="#" class="delBtn" data-type="itin-comment" data-alert="true"><i class="fa fa-trash pull-right"></i></a>
</article>
<article class="row fadeSec" id="61">
<a href="#" class="delBtn" data-type="itin-comment" data-alert="true"><i class="fa fa-trash pull-right"></i></a>
</article>

简讯

$(document).on("click", ".delBtn", function(){
var element = $(this);
var deleteID = element.closest('.fadeSec').attr("id");
var type = element.attr("data-type");
var alertMsg = element.attr("data-alert");
if (alertDeleteComment(deleteID))
{
var info = 'deleteID=' + deleteID + "&type=" + type;          
//  alert(info);
$.ajax({
type: 'POST',
url: 'ajax/ajax_delete_id.php',
data: info,
async: false,
success: function (data) {
if (data != "false") {
element.closest('.fadeSec').animate({ opacity: "hide" }, "slow");
}
}
});
}

}(;

Answer 1

您应该防止默认行为：

$(document).on("click", ".delBtn", function(e){
e.preventDefault(); // <---- THIS IS THE PREVENTION
var element = $(this);
var deleteID = element.closest('.fadeSec').attr("id");
var type = element.attr("data-type");
var alertMsg = element.attr("data-alert");
if (alertDeleteComment(deleteID))
{
var info = 'deleteID=' + deleteID + "&type=" + type;          
//  alert(info);
$.ajax({
type: 'POST',
url: 'ajax/ajax_delete_id.php',
data: info,
async: false,
success: function (data) {
if (data != "false") {
element.closest('.fadeSec').animate({ opacity: "hide" }, "slow");
}
}
});
}