Html 关闭 textarea 调整大小
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11401605/
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
Turn off textarea resizing
提问by Wizard
I'm trying to turn off textarea resizing in my site; right now I'm using this method:
我正在尝试关闭我网站中的 textarea 调整大小；现在我正在使用这种方法：
.textarea {
clear:left;
min-width: 267px;
max-width: 267px;
min-height:150px;
max-height:150px;
}
I know that my method is not correct and I'm searching for a better one in JavaScript. I'm a beginner, so the best solution for me will be HTML5 or jQuery.
我知道我的方法不正确，我正在 JavaScript 中寻找更好的方法。我是初学者，所以对我来说最好的解决方案是 HTML5 或 jQuery。
回答by feco
Try this CSS to disable resizing
试试这个 CSS 来禁用调整大小
The CSS to disable resizing for all textareas looks like this:
禁用所有文本区域调整大小的 CSS 如下所示：
textarea {
resize: none;
}
You could instead just assign it to a single textarea by name (where the textarea HTML is ):
您可以改为按名称将其分配给单个文本区域（文本区域 HTML 所在的位置）：
textarea[name=foo] {
resize: none;
}
Or by id (where the textarea HTML is ):
或者通过 id （其中 textarea HTML 是 ）：
#foo {
resize: none;
}
Taken from: http://www.electrictoolbox.com/disable-textarea-resizing-safari-chrome/
取自：http: //www.electrictoolbox.com/disable-textarea-resizing-safari-chrome/
回答by Raab
this will do your job
这将完成你的工作
textarea{
resize:none;
}
回答by Oriol
CSS3 can solve this problem. Unfortunately it's only supported on 60% of used browsersnowadays.
CSS3 可以解决这个问题。不幸的是，现在只有60% 的浏览器支持它。
For IE and iOS you can't turn off resizing but you can limit the textareadimension by setting its widthand height.
对于 IE 和 iOS，您无法关闭调整大小，但可以textarea通过设置其width和来限制尺寸height。
/* One can also turn on/off specific axis. Defaults to both on. */
textarea { resize:vertical; } /* none|horizontal|vertical|both */
回答by Darlesson
Just one extra option, if you want to revert the default behaviour for all textareas in the application, you could add the following to your CSS:
只是一个额外的选项，如果您想恢复应用程序中所有文本区域的默认行为，您可以将以下内容添加到您的 CSS 中：
textarea:not([resize="true"]) {
resize: none !important;
}
And do the following to enable where you want resizing:
并执行以下操作以启用要调整大小的位置：
<textarea resize="true"></textarea>
Have in mind this solution might not work in all browsers you may want to support. You can check the list of support for resizehere: http://caniuse.com/#feat=css-resize
请记住，此解决方案可能不适用于您可能想要支持的所有浏览器。您可以在resize此处查看支持列表：http: //caniuse.com/#feat=css-resize
回答by Thusitha Wickramasinghe
It can done easy by just using html draggable attribute
只需使用 html 可拖动属性即可轻松完成
<textarea name="mytextarea" draggable="false"></textarea>
Default value is true.
默认值为真。
回答by Mano
As per the question, i have listed the answers in javascript
根据问题，我已经在javascript 中列出了答案
By Selecting TagName
通过选择标签名
document.getElementsByTagName('textarea')[0].style.resize = "none";
By Selecting Id
通过选择 ID
document.getElementById('textArea').style.resize = "none";
回答by Kordrad
This is works for me
这对我有用
<textarea
type='text'
style="resize: none"
>
Some text
</textarea>回答by nobody
//CSS:
.textarea {
resize: none;
min-width: //-> Integer number of pixels
min-height: //-> Integer number of pixels
max-width: //-> min-width
max-height: //-> min-height
}
above code works on most browsers
以上代码适用于大多数浏览器
//HTML:
<textarea id='textarea' draggable='false'></textarea>
do both for it to work on the maximum number of browsers
两者都做才能在最大数量的浏览器上工作
