如何在HTML中将表单字段变灰

Question

我正在尝试将HTML中的表单字段灰显，以使用户无法对其进行编辑，因为它将被预先填充。这是有问题的代码部分：

<div class="element-input"><label class="title">Name</label><input value="<?php echo $data ?>"  class="large"  type="text" name="name" disabled/></div>

，当我在浏览器中呈现它时，我看到它已按计划预先填充，因此我无法对其进行编辑，但是当我将其提交到数据库时，它可以正常工作，并且除我怀疑“名称”是由于disabled属性引起的。

是否仍然可以防止用户编辑字段/将字段显示为灰色，而仍将其插入数据库中？

Answer 1

只需添加只读属性：

<div class="element-input">
 <label class="title">Name</label>
 <input value="<?php echo $data ?>" class="large" type="text" name="name" readonly />
</div>

只读输入字段无法修改（但是，用户可以对其进行制表，突出显示并从中复制文本）。

顺便说一句，有时将字段设为只读，然后在满足其他一些条件时使用javaScript删除该属性很方便。