输入值可以与 HTML 表单中的占位符相同吗？

Posted 2023-02-24

【中文标题】输入值可以与 HTML 表单中的占位符相同吗？

【英文标题】：Can the input value be the same as a placeholder in an HTML form?

【发布时间】：2016-10-20 19:54:15

【问题描述】：

我有一个接受 CVV 编号作为字段项之一的 html 表单 -

<label for="cvv">CVV</label>
<input type="text" placeholder="123" maxlength="3" id="cvv" name="cvv">

如您所见，它有一个placeholder="123"。我正在将 CVV 编号作为数组的一部分输入到我的数据库中 -

$pay = array(
    'cardno' => $cardno,
    'exp' => $this->input->post('exp'),
    'cvv' => $this->input->post('cvv'),
    'name' => $this->input->post('name'),
    'org' => $this->session->userdata['user_data']['org']
    );
$this->db->insert('payment', $pay);

我可以将任何 CVV 值输入到数据库中，除了 123，它与占位符值相同。我不断收到以下错误 -

Error Number: 1366

Incorrect integer value: '' for column 'cvv' at row 1

INSERT INTO `payment` (`cardno`, `exp`, `cvv`, `name`, `org`) VALUES ('6547893210258135', '04/20', '', 'Joe Bloggs', '15')

Filename: C:\xampp\htdocs\ci_redesign_newdb\system\database\DB_driver.php

Line Number: 330

当我在将$pay 数组插入数据库之前打印cvv as 123 时，CVV 字段为空 -

Array ( [cardno] => 6547893210258135 [exp] => 04/20 [cvv] => [name] => Joe Bloggs [org] => 15 )

但是，如果我将 CVV 值更改为其他值，CVV 字段将被填充 -

Array ( [cardno] => 6547893210258135 [exp] => 04/20 [cvv] => 103 [name] => Joe Bloggs [org] => 15 )

并且由于该字段已填充，因此我可以将其输入数据库而不会出现任何错误。表单不接受与字段占位符相同的值（在这种情况下为 123）可能是什么原因？

编辑 1

表单中的所有输入字段似乎都存在此问题。我只注意到cvv，因为我碰巧输入了123 作为测试。因此，看起来输入的输入值与占位符值相同的所有字段都没有被输入。

编辑 2 - 问题来源

看起来问题源于 jQuery 源文件版本 2.0.3。我在我的代码中注释掉了该文件 -

<script src='<?php echo base_url(); ?>assets/js/jquery-2.0.3.min.js'></script>

并且我能够发布与占位符相同的输入值 -

Array ( [cardno] => 1234567890123456 [exp] => mm/yy [cvv] => 123 [name] => Name [org] => 15 )

这个问题可以通过编辑 jQuery 源文件来解决吗？我应该做出这样的改变吗？不想做出可能导致其他地方出现问题的更改。

【问题讨论】：

您确定要在 cvv 中插入任何值吗？再次检查您的验证。您是否尝试过通过 phpMyAdmin 插入 123？如果有效，则说明您的代码有问题。

@BenJunior 我确定我将值 123 插入到 cvv 中。在我的本地主机和测试服务器上检查了多次。我可以在 SQLyog 中手动输入值。我敢肯定，代码中肯定有问题。 php 没问题，因为它能够插入 123 以外的值。我认为占位符在某种程度上导致了冲突。

好吧，将占位符设为103 并尝试使用123 和103 这两个值。还要注意maxlength - CVV 的长度可以是 4 位数。

当您说您在 cvv 字段中输入了占位符值时，您是实际输入了它还是只是留下了该字段中的占位符文本。占位符文本通常不会发送到服务器，因此您需要在 cvv 输入中按字面意思键入 123，服务器才能看到该值。

该页面上是否有任何 javascript 处于活动状态？

【参考方案1】：

这真的很奇怪。我确定有一些 JavaScript 代码或您正在使用的库导致了这种情况。

解决问题的一种可能方法是在提交之前删除/更改输入的占位符属性。

例如；

<form id="yourform" name="yourform">
 <input type="text" placeholder="123" id="cvv"/>
 <div class="button" onclick="submitForm()">Submit</div>
</form>

在 JS 中；

function submitForm()
   document.getElementById("cvv").placeholder = "";
    //Do it for all of your input elems.

   document.yourform.submit();

不确定它是否会起作用，我也不知道解决它的实际正确方法，但可以解决问题。

【讨论】：

这是一个很好的解决方法。谢谢！问题似乎是我正在使用的 jQuery 源文件。我将编辑问题以发布更多详细信息。