使用keyup键键入时调整文本区域宽度

Resize textarea width while typing using keyup

本文关键字：区域 文本 keyup 使用 调整      更新时间：2024-03-15

有两个文本区域具有完全相同的文本格式。ID是CCD_ 1和CCD_。

我已经为textarea设置了一些事情。我的问题是，当用户输入textareaA时，如何设置textareaB以调整其宽度？

这是我尝试过的，但没有成功。

$(document).on("click blur keyup", ".fT", function() { // keyup responds with textareaA
        var newWidth = $("#textareaA").val(); //does not work
        $("#textareaB").width(newWidth);
});

使用.css("proprety", "value") JQuery方法执行此操作。

用法：

$(document).keyup(function(event)) {
    $("#textareaB").css("width", "1000px");
});

用法（带变量）：

var myVariable = 1000; /* integer here */
$(document).keyup(function(event)) {
    $("#textareaB").css("width", myVariable.toString() + "px");
});

 $('#TextAreaId').keyup(function(e) {
         while ($(this).outerHeight() < this.scrollHeight + parseFloat($(this).css("borderTopWidth")) + parseFloat($(this).css("borderBottomWidth"))) {
             $(this).height($(this).height() + 1);
         };
     });

编辑2：（增加文本区域宽度）

注意：如果根据您的需要和最适合的情况，请更改中的值'8'

$(function() {   
$('#mta').keyup(function(e) {
    console.log($(this).outerWidth()+'--'+$(this).val().length*8);
         if($(this).outerWidth() > $(this).val().length) {
             $(this).width($(this).width() + 1);
         };
     });
 });
相关文章：