Html 禁用编辑文本输入的默认值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13701923/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
disable editing default value of text input
提问by halofourteen
I have a search form
我有一个搜索表单
<input id="price_from" value="price from ">
<input id="price_to" value="price to ">
<button>search</button>
How can I disable editing of dafault text? When user starts to type in price amount it's not possible to edit "price from " and "price to " but they stay in input field. I've tried different mask plugins for jquery but they didn't show default text untill you focus on field and don't provide option for custom text. Only placeholders an chars.
如何禁用 dafault 文本的编辑？当用户开始输入价格金额时，无法编辑“价格从”和“价格到”，但它们会留在输入字段中。我已经为 jquery 尝试了不同的掩码插件，但是直到您专注于字段并且不提供自定义文本选项时，它们才显示默认文本。只有占位符一个字符。
回答by chrki
You can either use the readonlyor the disabledattribute. Note that when disabled, the input's value will not be submitted when submitting the form.
您可以使用readonly或disabled属性。请注意，禁用时，提交表单时将不会提交输入的值。
<input id="price_to" value="price to" readonly="readonly">
<input id="price_to" value="price to" disabled="disabled">
回答by Schoof
I'm not sure I understand the question correctly, but if you want to prevent people from writing in the input field you can use the disabledattribute.
我不确定我是否正确理解了这个问题，但是如果您想阻止人们在输入字段中书写，您可以使用该disabled属性。
<input disabled="disabled" id="price_from" value="price from ">
回答by Freddy Yang
I don't think all the other answerers understood the question correctly. The question requires disabling editing part of the text. One solution I can think of is simulating a textbox with a fixedprefix which is not part of the textarea or input.
我不认为所有其他回答者都正确理解了这个问题。该问题需要禁用编辑部分文本。我能想到的一个解决方案是模拟一个带有固定前缀的文本框，它不是文本区域或输入的一部分。
An example of this approach is:
这种方法的一个例子是：
<div style="border:1px solid gray; color:#999999; font-family:arial; font-size:10pt; width:200px; white-space:nowrap;">Default Notes<br/>
<textarea style="border:0px solid black;" cols="39" rows="5"></textarea></div>
The other approach, which I end up using is using JS and JQuery to simulate "Disable" feature. Example with pseudo-code (cannot be specific cause of legal issue):
我最终使用的另一种方法是使用 JS 和 JQuery 来模拟“禁用”功能。伪代码示例（不能是法律问题的具体原因）：
// disable existing notes by preventing keystroke
document.getElementById("txtNotes").addEventListener('keydown', function (e) {
if (cursorLocation < defaultNoteLength ) {
e.preventDefault();
});
// disable existing notes by preventing right click
document.addEventListener('contextmenu', function (e) {
if (cursorLocation < defaultNoteLength )
e.preventDefault();
});
Thanks, Carsten, for mentioning that this question is old, but I found that the solution might help other people in the future.
谢谢 Carsten，你提到这个问题已经很老了，但我发现该解决方案将来可能会帮助其他人。
回答by halofourteen
回答by Gnijuohz
How about disabled=disabled:
怎么样disabled=disabled：
<input id="price_from" value="price from " disabled="disabled">????????????
Problem is if you don't want user to edit them, why display them in input? You can hide them even if you want to submit a form. And to display information, just use other tag instead.
问题是如果您不想让用户编辑它们，为什么要在输入中显示它们？即使您想提交表单，也可以隐藏它们。而要显示信息，只需使用其他标签即可。
