阻止用户在输入字段中输入文本答案

【问题标题】：Stop user from inputing text in input field阻止用户在输入字段中输入文本
【发布时间】：2016-09-08 15:13:30
【问题描述】：

是否有css 或html 唯一的方法来阻止用户在输入字段中输入？

我想在输入字段中动态添加内容和删除内容等，但我不希望用户能够编辑它并且使用html 标签上的disable 属性阻止我做我想做的事想要。

【问题讨论】：

标签： html css

【解决方案1】：

您可以使用readonly 或disabled 属性。

使用disabled的缺点是表单提交时disabled元素的值不会被提交。

您可能需要readonly。可以轻松地将其设置为看起来像禁用的元素。

document.getElementById('test').value = 'Hello World!';

[readonly] {
  border: 1px solid #ccc;
  background-color: #eee;
}

&lt;input type="text" id="test" name="test" readonly&gt;

【讨论】：

【解决方案2】：

您可以使用属性readonly - 阅读它here

【讨论】：

【解决方案3】：

是的，您只需将输入元素的disabled 属性设置为true。这将阻止用户修改其内容，但您可以通过使用 Javascript 修改其value 属性来做您喜欢的事情。

【讨论】：

【解决方案4】：

为其添加只读

&lt;input type="text" value="Hello" readonly /&gt;

【讨论】：

【解决方案5】：

嗯.....

<input type="text" name="myInput" value="Whatever" readonly="readonly" />

【讨论】：

【解决方案6】：

您可以使用 CSS 伪造禁用的效果。

pointer-events:none;

您可能还想更改颜色等。

CSS 并不是为了改变表单元素的行为。这只是为了改变他们的风格。隐藏文本字段并不意味着文本字段不再存在，或者当您提交表单时浏览器不会发送其数据。它所做的只是将其隐藏在用户的视线之外。

要真正禁用您的字段，您必须在 HTML 中使用 disabled 属性或在 JavaScript 中使用 disabled DOM 属性。

或查询

$('#fieldname').attr('disabled', 'disabled'); //Disable
$('#fieldname').removeAttr('disabled'); //Enable

【讨论】：