ajax - 如何防止多个ajax?
问题描述
当我单击删除按钮时,也调用了详细信息按钮的 ajax。那么如何防止多个ajax呢?
<div id="detail_message" data-id="{{ $value->message->id }}">
<i class="fa fa-trash icon col-6" aria-hidden="true"style="font-size: 20px; color: #5b5b5b" id="delete_message" data-id="{{ $value->message->id }}"></i>
</div>
$('#delete_message').click(function(event){
event.preventDefault();
var id = $(this).attr('data-id');
$.ajax({
url: '{{ url("message/delete_message") }}/'+id,
type: 'GET',
success: function(data){
alert('Message Deleted Successfully');
}
})
});
$('#detail_message').click(function(event){
event.preventDefault();
var id = $(this).attr('data-id');
$.ajax({
url: '{{ url("message/detail_message") }}/'+id,
type: 'GET',
success: function(data){
$('#content-message').html(data);
}
})
});
解决方案
在您的删除消息单击事件上添加 event.stopPropagation()。
$('#delete_message').click(function(event){
event.preventDefault();
event.stopPropagation();
var id = $(this).attr('data-id');
$.ajax({
url: '{{ url("message/delete_message") }}/'+id,
type: 'GET',
success: function(data){
alert('Message Deleted Successfully');
}
})
});
说明:当单击删除消息按钮时,事件被触发并不断冒泡到其所有父部门。event.stopPropagation() 停止事件的冒泡,并且在单击子项时不会触发父除法事件。
推荐阅读
- ios - 我可以通过 ChildView 中的按钮将 ParentView 导航到另一个视图吗?,swiftUI
- jquery - 如何使用 jquery 在下拉列表中隐藏选项?
- python - 使用熊猫提取具有特定列值的行,列上没有标题
- eclipse - Eclipse 2020-12 (4.18.0) 中没有可选的 SSH 代理
- node.js - 写入文件时的编码问题
- r - 为什么 R 中的 data.frame 会意外更改数据类型?
- javascript - 在 React 中使用 map 函数渲染数组时出现意外的标记 (>)
- c++ - iter_swap 产生错误的结果
- python - 有没有更快的方法从 python 获取大数据帧到 sql server 表?
- c++ - 内循环减少的openmp崩溃