如何使用 javascript 隐藏 HTML 输入字段
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4258084/
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
How to hide an HTML input field with javascript
提问by Nir
I need to hide a text input field with javascript. Changing its type attribute to hidden does not work in IE (security issue).
我需要使用 javascript 隐藏文本输入字段。将其类型属性更改为隐藏在 IE 中不起作用（安全问题）。
What would be the best way to do it?
最好的方法是什么？
Note: No jQuery or other lib can be assumed.
注意：不能假设 jQuery 或其他库。
采纳答案by Stephen P
I assume you have to show and hide the text field dynamically based on changing conditions in the form, otherwise you'd just make it an <input type="hidden"...to begin with.
我假设您必须根据表单中不断变化的条件动态显示和隐藏文本字段，否则您只需从头<input type="hidden"...开始。
Keep your code that shows and hides the field as it is, but also catch the onsubmitevent.
保持显示和隐藏字段的代码原样，但也要捕获onsubmit事件。
In the submit handler, get your text field via document.getElementById(...)(or by accessing document.forms[i]) and check to see whether or not it's hidden.
在提交处理程序中，通过document.getElementById(...)（或通过访问document.forms[i]）获取您的文本字段并检查它是否被隐藏。
If it ishidden, create a new DOM node for an <input type="hidden" ...>field and add that node to the form, probably via myform.appendChild(...). You'll have to give it the name your server-side code expects. Copy the contents of the hidden text field into the newly created type=hidden field, then return from your submit handler, allowing the standard submit to continue.
如果它是隐藏的，则为一个<input type="hidden" ...>字段创建一个新的 DOM 节点并将该节点添加到表单中，可能通过myform.appendChild(...). 您必须为其指定服务器端代码所期望的名称。将隐藏文本字段的内容复制到新创建的 type=hidden 字段中，然后从提交处理程序返回，允许标准提交继续。
You could also just un-hide the text field on submit, but you'd have to move it "off screen" also or the user would see it reappear during submit processing.
您也可以在提交时取消隐藏文本字段，但您也必须将其移到“屏幕外”，否则用户会在提交处理期间看到它重新出现。
回答by meder omuraliev
The only way you can change it is before you append it to the DOM. You can make a new element and then replace the current one with it.
您可以更改它的唯一方法是在将其附加到 DOM 之前。您可以创建一个新元素，然后用它替换当前元素。
Look at replaceChild and createElement since you want to do manual DOM scripting. I assume you know what to do.
看看 replaceChild 和 createElement ，因为你想手动编写 DOM 脚本。我想你知道该怎么做。
EDIT: "Hidden" fields as far as I know aresent. Have you checked whether they are? And you can also just do position:absolute; left:-9999em;to offset them.
编辑：据我所知，“隐藏”字段已发送。你检查过它们吗？你也可以做position:absolute; left:-9999em;来抵消它们。
回答by Free Consulting
document.myform.myelement.style.display = 'none'
document.myform.myelement.style.display = '无'
works as expected even in Internet Explorer.
即使在 Internet Explorer 中也能按预期工作。
回答by Dave
Try wrapping it in a div or span and then setting the display style to none when you want to hide it, and then to block (if you used a div) or inline (if you used a span) when you want to show it.
尝试将其包装在 div 或 span 中，然后在要隐藏它时将显示样式设置为 none，然后在要显示时将其设置为 block（如果使用 div）或内联（如果使用 span）。
