在 PHP 中提交表单后的警报消息
[英]Alert message after submitting form in PHP
问题描述
我正在使用带有 POST 方法的表单来应用会话，一旦提交表单，页面就会重新加载，并且屏幕上没有任何警报。
所以我使用了一些我在网上找到的技巧，但它有问题，提交表单后弹出警报，但页面设计均无效，这意味着我只有空白页面和警报消息。
单击“确定”关闭警报消息后，页面将加载。
if(empty($_SESSION["shopping_cart"])) {
$_SESSION["shopping_cart"] = $cartArray;
$status = "Product is added to your cart!";
header('location:product.php?status=success');
}else{
$array_keys = array_keys($_SESSION["shopping_cart"]);
if(in_array($code,$array_keys)) {
$status = "Product is already added to your cart!";
header('location:product.php?status=failed');
} else {
$_SESSION["shopping_cart"] = array_merge($_SESSION["shopping_cart"],$cartArray);
$status = "Product is added to your cart!";
header('location:product.php?status=success');
}
}
// This right here responsible to alert the message according to the status.
if( $_GET['status'] == 'success') {
echo '<script> alert("welldone"); </script>';
}
else{
echo '<script> alert("no good"); </script>';
}
如何解决页面加载顺序，以便先加载页面，然后再加载警报？
6 个解决方案
解决方案1
0 2020-02-02 22:33:18
我在这个问题上遇到了很多麻烦——即使使用标记为“正确”的旧答案。
我找到了解决办法。 在窗口加载和文档就绪时不起作用。 但是，如果您使用以下脚本在页面底部添加图像，则在加载图像之前（在页面加载结束时）不会调用它。
这在我所有的测试中都有效。
<img id='workaround' src='https://picsum.photos/1/1'> <!-- any transparent 1x1 image would work -->
<script>
$("#workaround").on( "load", function(){
alert("Image loaded.");
});
</script>
所以为了你的目的（或类似的）
<img id='workaround' src='https://picsum.photos/1/1'>
<script>
$("#workaround").on( "load", function(){
<?php
if( $_GET['status'] == 'success') {
echo 'alert("welldone");';
}
else{
echo 'alert("no good");';
}
?>
});
</script>
解决方案2
0 2020-02-02 22:42:53
alert()在调用脚本的时候停止脚本的执行和 HTML 页面的加载。 您应该将此脚本移至页面底部。
解决方案3
0 2020-02-03 05:26:04
@Yotam 大汉
请尝试此代码，以在 PHP 中提交表单后发出警报消息。
<?
if ($_POST)
{
if (empty($_POST['testabc'])) $msg='<script type="text/javascript">alert("BLANK");</script>';
else $msg='<script type="text/javascript">alert("NOT BLANK");</script>';
}
?>
<html><head></head><body>
<table>
<tr>
<td>
<form id="finfo" method=POST>
<input type="text" name="testabc">
<input type="submit" value="info">
</form>
</td>
</tr>
</table>
<script type="text/javascript">alert("auto");</script>
<? echo $msg; ?>
</body></html>
我希望上面的代码对你有用。
谢谢你。
解决方案4
0 已采纳 2020-02-03 08:25:46
经过长时间的研究，我找到了使用 jQuery delay()函数延迟警报消息的解决方案，延迟允许 HTML 页面加载然后执行警报。 感谢所有帮助我达到这个结果的人。
<script>
$(document).ready(function(){
setTimeout(function() {
<?php
if( $_GET['status'] == 'success') {
echo 'alert("welldone");';
}
else{
echo 'alert("no good");';
}
?>
}, 500);
});
</script>
解决方案5
0 2020-02-28 00:23:33
您可以推迟 script 标签，直到页面呈现后它才会加载。
<script src="alert.js" defer></script>
然后它会在页面呈现后加载，并且不会有随机延迟（例如使用 wait/jquery 延迟）。
解决方案6
-1 2020-09-24 14:13:29
Bootstrap 模式也可能是更好的选择。 模态看起来比警告对话框更漂亮。 它不会在消息显示期间更改当前页面布局。
在php代码中：
// This right here responsible to alert the message according to the status.
$message = '';
$show_modal = false;
if( $_GET['status'] == 'success') {
$message = "Well Done";
$show_modal = true;
}
else{
$message = "No Good";
$show_modal = true;
}
在 html head 标签中：
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
然后在html中：
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Alert!</h4>
</div>
<div class="modal-body">
<p><?php echo ($message); ?></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
最后在js中显示带有条件的模态：
<?php if($show_modal):?>
<script> $('#myModal').modal('show');</script>
<?php endif;?>
提交表单后的 JavaScript 警报
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.