javascript - 输入大于最大宽度时，动态扩展文本区域的高度

当键入的文本区域元素的最大宽度大于文本区域元素的最大宽度时，如何水平扩展文本区域？另外我也不想看到水平滚动条。

渲染的HTML

<textarea name="CatchPhrase" class="input-validation-error" id="CatchPhrase" aria-invalid="true" aria-required="true" aria-describedby="CatchPhrase-error" rows="2" cols="20" data-val-required="The Catch Phrase field is required." data-val="true" data-val-maxlength-max="50"
data-val-maxlength="The field Catch Phrase must be a string or array type with a maximum length of '50'." htmlattributes="{ id = profileCatchPhrase, class = form-control }">I like yoga sd;lasdlk asdks';aksd'asd 'asd';las ';asd'lasd';las'dl as'dla'sdl'asld as'd;las'dl; a;sdlka;sdklasd ;alsd;lkasda ;alskd;lkasd ;lkasd;lk</textarea>

呈现HTML之前

<div class="form-group">
  @Html.LabelFor(model => model.CatchPhrase, htmlAttributes: new { @class = "control-label col-lg-2 col-md-2 col-sm-2 col-xs-2" })
  <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10">
    @Html.TextAreaFor(model => model.CatchPhrase, new { htmlAttributes = new { id = "profileCatchPhrase", @class = "form-control" } }) @Html.ValidationMessageFor(model => model.CatchPhrase, "", new { @class = "text-danger" })
  </div>
</div>

最佳答案

尝试这样的事情：

$('#CatchPhrase').on('input', function() {
  $(this).outerHeight(38).outerHeight(this.scrollHeight);
});

参见：https://stackoverflow.com/a/34513436/4613398

jsfiddle：https://jsfiddle.net/3qmztmjj/

关于javascript - 输入大于最大宽度时，动态扩展文本区域的高度，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35262650/