方法jQuery

Question

我创建了一个要从我的数据库中删除的PHP页面。此PHP页面是表单提交的操作。通过单击“X”符号的图片提交表单。如何在提交表单之前要求用户确认并从我的数据库中删除？

这是我的代码：

<form method='POST' action='delete.php'><input type='image' src='images/delete.png' class='del' alt='Submit Form' />

我尝试通过将其添加到我的表单标记来内联，但它不起作用：

onsubmit="return confirm('Are you sure you want to submit this form?');"

Answer 1

来自OP的评论：

echo "onclick='return confirm(\'Are you sure you want to submit this form?\');'"

您不能在用单引号分隔的属性值中使用单引号。

您的选择是：

在JS中使用双引号

echo "onclick='return confirm(\"Are you sure you want to submit this form?\");'"

在HTML

中使用双引号

echo "onclick=\"return confirm('Are you sure you want to submit this form?');\""

使用实体

echo "onclick='return confirm(&quot;Are you sure you want to submit this form?&quot;);\""

当你把JavaScript放在PHP字符串中的HTML属性值中时，你将三种不同的语言混合在一起，你必须非常非常小心你的转义，以便你在正确的语言中转义正确的字符正确的时间。

根据经验，最好将PHP字符串的内容保持在最低限度。只有变量时才进入PHP模式。

?>
    <form method='POST' action='delete.php'>
        <input type='image' src='images/delete.png' class='del' alt='Submit Form' onclick="return confirm('Are you sure you want to submit this form?');" />
    </form>
<?php

出于同样的原因，最好将JavaScript保存在外部文件中，并使用addEventListener而不是onFOO属性附加事件处理程序。

Answer 2

这将有效

  <form method='POST' action='delete.php' onsubmit="return confirm('Are you sure you want to submit this form?');">
<input type='image' src='images/delete.png' class='del' alt='Submit Form' /></form>

Answer 3

如果您在自己的网站上使用jQuery，那么这是最佳解决方案。

方法jQuery

您的HTML：

<form class="sendingForm" method='POST' action='delete.php'> 
    <input type='image' src='images/delete.png' class='del' alt='Submit Form' />
</form>

所以我给了一个课： sendingForm

您的JavaScript部分：

$(".sendingForm").submit(function() {
    if (confirm("Please confirm!")) return true;
    else return false;       
});

你可以检查一下：http://jsfiddle.net/d6gem0ty/

方法内联

最短的解决方案可能更容易。这里只有HTML和onclick事件。

<form class="sendingForm" method='POST' action='delete.php'>
<input onclick="return confirm('Please confirm!')"  type='image' src='images/delete.png' class='del' alt='Submit Form' />

您可以查看它：http://jsfiddle.net/d6gem0ty/1/

表格提交前确认

3 个答案:

方法jQuery

方法内联