CSS 导致 SQL INSERT 执行两次

Question

我的PHP 页面中有一个INSERT 查询，它按预期执行一次，并且工作正常，正是我想要的。

if(!$con->query("INSERT INTO contracts (CID, DATE, NUMBER, TITLE, DESCRIPTION) VALUES ('$cid', '" . $con->real_escape_string($date) . "', '" . $con->real_escape_string($number[$counter]) . "', '" . $con->real_escape_string($title[$counter]) . "', '" . $con->real_escape_string($description[$counter]) . "')"))
            {
                printf("Error message: %s\n", $con->error);
            }

现在，我在同一个 PHP 文件中添加以下 CSS 以使我输出的表格更易于阅读：

<style>
tr:nth-child(even) {
    background-color: e5e4e2;
}
</style>

这使得其他每一行都是灰色的，太棒了......但是等等！现在我的SQL INSERT 发生了两次。我不知道这些是如何连接的，当我删除 CSS 时，INSERT 会按照我的需要执行一次。

这里有一些我不理解的诡计吗？ CSS 会如何影响我的 SQL 查询？

我正在使用 XAMPP，PHP 版本 5.5.15 和 phpMyAdmin 用于数据库表。

编辑：我检查了数据库，它插入了两次。
查询设置为一个按钮，我使用if (isset($_GET['insertIt'])) {// INSERT QUERY 这样当用户单击此按钮时：
<a href = 'testing.php?insertIt=true'><button style="height: 30px; margin-left: 10px; margin-right: 10px">2. Insert New Contracts To 'contracts' Table</button></a>
发送查询。如果没有 CSS，它可以正常工作，但它会运行两次

编辑 2： 好的，这是我单击按钮时开发人员工具的两个屏幕截图。我发现这不是CSS 的遗漏，而是<style> ... </style> 标签的遗漏；当我把它们排除在外时，我得到这个：
当它们在我的PHP 文件中时，我得到这个：
我可以接受这个并尝试通过分离文件或离开来解决它标签完全消失，但我仍然很想知道为什么会发生。我不是专家，但我可以看到当没有 <style> 标签和条目时，有一个额外的调用 insertIt插入两次。
为了记录，我希望能够

1. 点击按钮
2. 插入条目一次
3. 并刷新页面，因为页面也会显示插入的结果。

Answer 1

查看您的代码 sn-ps 当然是不够的，但让我向您推荐解决方案并解释一下您在这里所做的事情。

1. 在这种情况下使用 GET 是不够的。我不知道你接下来要做什么（插入记录后的任何重定向？），但我想什么都没有发生。一个好主意是使用 POST，因为您在表中创建行。
2. 触发表单的动作是点击，但是点击什么？您在链接中有一个按钮。 <a><button></button></a> 不是元素是控制元素。我建议将其修复为<button type="submit" style="height: 30px; margin-left: 10px; margin-right: 10px">2. Insert New Contracts To 'contracts' Table</button> 并删除<a>，您将发布到的 URL 应该来自表单操作属性。如果您确实需要使用 JavaScript 发布事件，这是另一回事，您提供的代码不足以了解您想要实现的目标。
3. 当有人可能会争辩说，由于 HTTP 协议标准，创建记录后重定向不好，但这是一种常见的做法，在执行表单操作后重定向到同一页面，以防止意外刷新页面创建多个记录。

这是我认为你应该做的伪代码：

<?php
    if (isset($_POST["...field name..."])) {
       ... perform INSERT ...
       ... do redirect to 'testing.php' ...
    } 
?>

<form action="testing.php" method="post">
    ... fields ...
   <button type="submit" style="height: 30px; margin-left: 10px; margin-right: 10px">2. Insert New Contracts To 'contracts' Table</button>
</form>

任何事情都不应该发生两次。如果您需要更多帮助 - 请成为我的客人并提出要求。