提交表单前确认

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?');"

- Sahar Alsadah

---

使用 onclick 处理按钮事件，而不是在表单上使用 onsubmit。 - Funk Forty Niner

如果您想确保要求确认，您需要在服务器端调用一个确认页面（一个新的php文件，带有两个按钮表单和先前输入的信息，在选择“是”时调用delete.php）。完成后，您可以添加一个带有ajax调用的javascript层以改善用户体验。这种方法的优点是您的应用程序可以使用或不使用javascript。 - Casimir et Hippolyte

你显然忽略了一些重要的代码，以及它是如何被使用的。我希望你不仅仅是回应“答案”；我们这里也需要一些反馈。 - Funk Forty Niner

@SaharAlsadah，你标记了“php”，但没有提供支持你问题的代码。我敢打赌，你在某个地方回显并使用了错误的引号或没有转义单引号。因为你没有给我们展示任何东西，导致别人的答案都被踩了。这不是我的踩哦。编辑：许多人已经删除了自己的答案。 - Funk Forty Niner

@SaharAlsadah，我的评论很清楚，你还想让我写什么？我现在要继续前进了。祝你好运。我已经浪费了足够的时间，就像你为每个人包括“你自己”所做的那样。 - Funk Forty Niner

Answer 1

根据原帖评论：

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?');\""

Use entities

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

当您将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属性。

- Quentin

---

我把PHP代码和HTML标签分开，它就起作用了。非常感谢您详细的回复。 - Sahar Alsadah

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>

- manu

---

这就是原帖中所说的他们正在做的事情。 - Quentin

如果这个方法对你有效，但对原帖作者无效，那么告诉他们重复他们已经做过的事情并不能解决问题，是吧？ - Quentin

我想你忘记放置 </form> 或者其他什么了，请复制上面的代码并检查它是否能正常工作。 - manu

省略结束标签对于 http://jsbin.com/faloboveyo/1/edit?html,output 的工作没有任何影响。 - Quentin

我不知道为什么它似乎没有起作用。无论如何，感谢您的回答。 - Sahar Alsadah

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/

- Maróthy Zsolt