首页 文章

如何使文本输入不可编辑？

提问于
浏览 次
323

所以我有一个文本输入

<input type="text" value="3" class="field left">

这是我的CSS

background:url("images/number-bg.png") no-repeat scroll 0 0 transparent;
border:0 none;
color:#FFFFFF;
height:17px;
margin:0 13px 0 0;
text-align:center;
width:17px;

有没有设置或诀窍，我正在考虑做一个标签，但造型如何 . 我如何转换它们并且有更好的方法还是唯一的方法？

html css html-input

8 回答

  • 26
    <input type="text" value="3" class="field left" readonly>

    没有造型需要 .

    请参阅MDN上的 <input> https://developer.mozilla.org/en/docs/Web/HTML/Element/input#Attributes

    回复于
  • 65

    您可以将属性 readonly 添加到输入：

    <input type="text" value="3"
       class="field left" readonly="readonly">

    更多信息：http://www.w3schools.com/tags/att_input_readonly.asp

    回复于
  • 3

    如果只想读取输入，可以使用 readonly 属性 . 你可以使用 disabled 属性，如果你想要显示输入，但完全禁用（甚至处理语言，如PHP将无法读取它们） .

    回复于
  • 40

    只是为了完成可用的答案：

    输入元素可以是只读的或禁用的（它们都不可编辑，但有一些区别：焦点，......）

    可以在这里找到很好的解释：
    What's the difference between disabled=“disabled” and readonly=“readonly” for HTML form input fields?

    如何使用：

    <input type="text" value="Example" disabled /> 
<input type="text" value="Example" readonly />

    还有一些解决方案可以通过CSS或JavaScript实现，如here所述 .

    回复于
  • 3

    添加readonly属性

    <input type="text" value="3" class="field left" readonly="readonly" >

    要么 -

    <input type="text" value="3" class="field left" readonly>

    不需要css！

    回复于
  • 2

    你只需要在最后添加 disabled

    <input type="text" value="3" class="field left" disabled>
    回复于
  • 1
    <input type="text" value="3" class="field left" readonly>

    你可以在https://www.w3schools.com/tags/att_input_readonly.asp看到

    设置“只读”的方法：

    $("input").attr("readonly", true)

    取消“readonly”（在jQuery中工作）：

    $("input").attr("readonly", false)
    回复于
  • 664

    添加 readonly ：

    <input type="text" value="3" class="field left" readonly>

    如果您希望不在表单中提交值，请添加 disabled 属性 .

    <input type="text" value="3" class="field left" disabled>
    回复于

相关问题