如何实现仅当差值字段值为0时提交借贷表单并触发错误提示？

要实现仅当diff1值为0时才能提交表单的需求，需要同时做前端客户端校验（提升用户体验）和后端服务端校验（防止恶意绕过前端直接提交），以下是具体修改方案：

一、前端代码修改（添加客户端校验） #

先修正原代码的语法错误，再加入JavaScript校验逻辑：

<html>
<body>
  <form method="POST" action="test.php" onsubmit="return validateForm()">
    <label>Debit:</label> <input type="text" name="debit1" id="debit1" class="form-control" required>
    <label>Credit:</label> <input type="text" name="credit1" id="credit1" class="form-control" required>
    <label>Difference:</label> <input type="text" name="diff1" id="diff1" class="form-control" required>
    <!-- 错误提示容器 -->
    <div id="errorMsg" style="color:red; display:none;">值不为0</div>
    <input type="submit" name="submit" id="submit" value="Submit" class="btn btn-success">
  </form>

  <script>
    function validateForm() {
      // 获取差值并转为数字，处理非数字输入
      const diffValue = parseFloat(document.getElementById('diff1').value);
      const errorMsg = document.getElementById('errorMsg');
      
      // 校验是否为0（兼容浮点精度问题）
      if (isNaN(diffValue) || Math.abs(diffValue) > 0.0001) {
        errorMsg.style.display = 'block';
        return false; // 阻止表单提交
      }
      errorMsg.style.display = 'none';
      return true; // 允许提交
    }
  </script>
</body>
</html>

前端修改说明： #

• 给表单绑定onsubmit事件，校验不通过时返回false阻止提交
• 新增错误提示容器，校验失败时显示提示文本
• 用parseFloat转换输入值，同时处理用户输入非数字的情况
• 用Math.abs(diffValue) > 0.0001判断是否不为0，避免浮点精度导致的误判

二、后端PHP代码修改（添加服务端校验+安全优化） #

前端校验可被绕过，必须在后端做兜底校验，同时修复原代码的逻辑漏洞和SQL注入风险：

<?php
if(isset($_POST['submit'])) {
    // 获取并过滤输入值
    $debit1 = trim($_POST['debit1']);
    $credit1 = trim($_POST['credit1']);
    $diff1 = trim($_POST['diff1']);

    // 后端二次校验差值是否为0
    $diffValue = floatval($diff1);
    if (is_nan($diffValue) || abs($diffValue) > 0.0001) {
        echo "值不为0";
        exit; // 终止执行，不插入数据库
    }

    // 连接数据库并执行插入（用预处理语句防SQL注入）
    require_once "config.php";
    $sqlInsert = "INSERT INTO iap3 (debit1, credit1, diff1) VALUES (?, ?, ?)";
    $stmt = mysqli_prepare($con, $sqlInsert);
    mysqli_stmt_bind_param($stmt, "sss", $debit1, $credit1, $diff1);
    
    // 执行插入并反馈结果
    if(mysqli_stmt_execute($stmt)) {
        echo "提交成功";
    } else {
        echo "插入失败: " . mysqli_error($con);
    }

    // 关闭资源
    mysqli_stmt_close($stmt);
    mysqli_close($con);
}
?>

后端修改说明： #

• 将数据库操作放在isset($_POST['submit'])判断内，避免未提交时变量未定义的错误
• 后端重新校验diff1值，确保非法提交被拦截
• 使用预处理语句替代直接拼接SQL，彻底避免SQL注入风险
• 添加插入结果判断，方便调试和反馈

内容的提问来源于stack exchange，提问作者Moon