Html 使用 DIV 作为输入
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/37667141/
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
Use a DIV as an input
提问by Arkius Azure
Sorry if this question is very basic, but I'm trying to get back into programming and I'm stuck with this.
对不起，如果这个问题非常基本，但我正在尝试重新回到编程中，但我被困在了这个问题上。
I want to have text input into a <div>in HTML, but I don't want the default chat box that comes with <input>. I just want it to directly print to a location within the <div>.
我想将文本输入到<div>HTML 中，但我不想要<input>. 我只是希望它直接打印到<div>.
How can I do this?
我怎样才能做到这一点？
回答by akazemis
You can use contenteditable attribute if you don't wanna submit its value to the server, just like this :
如果您不想将其值提交给服务器，则可以使用 contenteditable 属性，就像这样：
<div contenteditable="true">I'm Editable. Edit me!</div>
So that user can edit the text but it's not gonna be sent to the server and it's just a client side stuff.
这样用户就可以编辑文本，但它不会被发送到服务器，它只是一个客户端的东西。
But if you need to submit the value to the server you have to use TextArea or Input tag and remove the borders by CSS styles. Say :
但是如果您需要将值提交给服务器，您必须使用 TextArea 或 Input 标签并通过 CSS 样式删除边框。说 ：
<input id="myText" type="text" style="border:none; background: transparent; outline: 0;"/>
回答by Jaqen H'ghar
Use a <div>
用一个 <div>
Make the div itself a text input (as you mentioned in the comments) by using contenteditableattribute:
使用contenteditable属性使 div 本身成为文本输入（如您在评论中提到的）：
<div contenteditable="true" style="outline:0px;">Hodor!</div>
To get the value you can use jQuery $("div").text()or js textContent
要获取值，您可以使用 jQuery$("div").text()或 jstextContent
To use the <div>inside a <form>add some js to wire it up. You can see an example here.
要使用<div>内部 a<form>添加一些 js 将其连接起来。您可以在此处查看示例。
Use a <textarea>
用一个 <textarea>
You can also use a <textarea>if you hide some properties:
<textarea>如果隐藏某些属性，也可以使用 a ：
<textarea style="resize:none;overflow:auto;
border:0px;outline:0px;background-color:transparent;">
Hodor!
</textarea>
To get the value you can use jQuery $("textarea").val()or js value
要获取值，您可以使用 jQuery$("textarea").val()或 jsvalue
回答by Vinay Emmaadii
@Arkius have you tried using TextArea "http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_textarea"
@Arkius 您是否尝试过使用 TextArea “ http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_textarea”
