如何用SweetAlert2跳转带GET参数并通过GET触发弹窗?
1. 解决参数传递问题:让跳转正确携带ID
你的核心问题出在PHP输出的onclick引号嵌套错误,导致ID值没被正确传递给JS函数。先修正这部分代码:
修正后的PHP代码
echo '<td style="text-align: center;"> <div class="btn-group dropup"> <button class="btn btn-info dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Action </button> <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton"> <a class="dropdown-item" href="edit_form.php?ID='.$operatives['ID'].'">Edit</a> <a class="dropdown-item red" onclick="oof('.$operatives['ID'].')" href="#">Purge</a> </div> </div> </td>';
这里把onclick里的嵌套双引号去掉了,直接将ID作为数字传入oof()函数——当ID是4时,点击Purge就会触发oof(4),JS就能拿到正确的ID值。
优化后的JS代码(逻辑更清晰)
<script> function oof(id){ Swal.fire({ title: 'Are you sure?', text: "You will be purging this person's account.", icon: 'warning', showCancelButton: true, confirmButtonColor: '#d33', cancelButtonColor: '#3085d6', confirmButtonText: 'Yes, purge account' }).then((result) => { // 注意:SweetAlert2 v10+ 用result.isConfirmed代替旧版的result.value if (result.isConfirmed) { // 用模板字符串拼接URL更直观 window.location.href = `deleting.php?ID=${id}`; } }) } </script>
这样修改后,点击确认就会正确跳转到deleting.php?ID=4。
2. 通过GET参数激活SweetAlert2
完全可以实现!比如用户访问你的页面.php?purge=4时,自动弹出确认弹窗,确认后跳转删除页面。做法如下:
<script> // 页面加载完成后检测GET参数 document.addEventListener('DOMContentLoaded', function() { // 解析URL中的GET参数 const urlParams = new URLSearchParams(window.location.search); const targetId = urlParams.get('purge'); // 如果检测到purge参数,直接触发弹窗 if (targetId) { Swal.fire({ title: 'Are you sure?', text: "You will be purging this person's account.", icon: 'warning', showCancelButton: true, confirmButtonColor: '#d33', cancelButtonColor: '#3085d6', confirmButtonText: 'Yes, purge account' }).then((result) => { if (result.isConfirmed) { window.location.href = `deleting.php?ID=${targetId}`; } else { // 用户取消后,移除URL中的purge参数,避免刷新重复弹窗 window.history.replaceState({}, document.title, window.location.pathname); } }); } }); // 保留原有的按钮点击触发函数 function oof(id){ Swal.fire({ title: 'Are you sure?', text: "You will be purging this person's account.", icon: 'warning', showCancelButton: true, confirmButtonColor: '#d33', cancelButtonColor: '#3085d6', confirmButtonText: 'Yes, purge account' }).then((result) => { if (result.isConfirmed) { window.location.href = `deleting.php?ID=${id}`; } }) } </script>
现在只要用户访问带?purge=xxx的URL,页面一加载就会弹出确认框,确认后跳转删除页面;取消的话会自动清除URL里的purge参数,避免重复触发。
内容的提问来源于stack exchange,提问作者Lunaria
相关产品推荐
相关产品推荐

