动态增加文本框高度? [复制]

2024-01-06

可能的重复:
自动调整文本区域大小 https://stackoverflow.com/questions/7477/autosizing-textarea

大家好,我正在尝试解决一个问题,但毫无进展。我想做的是当用户文本溢出输入框的宽度时动态更改输入框的高度(有点像 Facebook 的状态更新文本框)。

您输入简短的更新,如果文本比文本框长,则会创建一个新行。我尝试使用文本区域,但无论出于何种原因,默认情况下都不能强制它恰好为 1 行。

有人知道这样做的简单方法吗? :(


您可以手动控制大小textarea使用 CSS 高度和宽度参数。通过将按键事件绑定到textarea,您可以获取框中的文本数量并相应地调整高度。例如,下面有一些 jQuery,每输入 50 个字符,框的高度就会增加 20 个像素:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js">
</script>

<textarea id="textbox" style="height:20px;width:400px;"></textarea>

<script type="text/javascript">
$(document).ready(function() {
    $("#textbox").val('');
    $("#textbox").keypress(function() {
        var textLength = $("#textbox").val().length;
        if (textLength % 50 == 0) {
            var height = textLength/50;
            $("#textbox").css('height', 20+(height*20));
        }
    });
});
</script>

您可以调整这些值以获得所需的效果。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

动态增加文本框高度? [复制] 的相关文章

  • JavaScript 对象镜像/单向属性同步

    出于安全目的 我需要一个 镜像 对象 也就是说 如果我创建对象 A 并浅克隆 A 的副本并将其称为 B 则每当 A 的属性发生更改时 我希望 B 自动更新自身以反映更改 但反之则不然 换句话说 单向属性同步 我的问题 是否已经存在我不知道的
  • Node 和 General 中的 MVC:模型如何与视图绑定?

    我从 node js 开始 正在制作一个简单的 MVC 框架 到目前为止 我已经有一个前端控制器 或 调度程序 如果你愿意的话 可以工作 路由通过调度程序配置模块进行 如图所示 我的问题在最后 紧接代码之后 另外 这是学习node的练习 请
  • 定时器内嵌套异步等待 - 不返回所需的值

    我必须使用 Mocha 和 chai 测试来测试端点的响应 下面是相同的代码 async function getData userId let response let interval setInterval async gt resp
  • Bootstrap 4:卡片作为具有相同高度和宽度的网格

    我正在尝试在具有相同高度和宽度的网格中订购卡片 这些卡片将有不同的内容和不同的尺寸 每行也应该有 3 个 每行的高度可以不同 但 行内的高度应该相同 整个网格中每张卡片的宽度应该相同 div class container div clas
  • 页面其余部分完成加载后延迟加载 html5 视频

    我有一个视频元素用作我正在构建的页面底部部分的背景 我试图通过将 src 存储为 data src 属性并使用 jQuery 在其他资源加载后将其应用到 src 属性 因为它不是英雄图像或任何东西 我想加载海报以节省加载时间 然后稍后加载视
  • 元素上的框阴影行为

    Update 在我提交错误报告后 https bugs chromium org p chromium issues detail id 763337 https bugs chromium org p chromium issues de
  • 是否可以向 JavaScript 函数发送可变数量的参数?

    是否可以从数组向 JavaScript 函数发送可变数量的参数 var arr a b c var func function debug alert arguments length for arg in arguments alert
  • JQuery - 如何检测给定 div 中存在给定类的 div 数量?

    我有一个这样的div div class x div 并包含在这个 div 中 我有几个像这样的 div div class y div div class y div div class y div etc 问题1 如何检测容器 div
  • 启动 onclick 比使用 document.onload 更快

    我有带有链接的 html 页面 我想在其中附加一个功能onclick事件 一种方法当然是 a href save php Save a 但我知道这不是最佳做法 所以我反而等待window onload 循环遍历链接并将保存功能附加到链接re
  • 无法安装js-bson

    我正在使用Windows 7 64位 尝试安装bson作为mongodb的依赖项 我收到此错误 npm WARN package json email protected cdn cgi l email protection No READ
  • 如何在没有 DOM 的情况下将 javascript 作为 node.js 脚本运行?

    https github com jasondavies d3 cloud https github com jasondavies d3 cloud是一个使用 D3 库的 javascript 文字云 这是一个交互式演示 http www
  • 什么是闭包编译器?

    如果您不知道我在说什么 请查看以下内容 http closure compiler appspot com home http closure compiler appspot com home 这是一个 JavaScript 压缩器 在他
  • JavaScript:嵌套循环?

    我想实现这样的动画 序列 动画以循环开始 想象一下car从 x1 移动到 x2 然后暂停 1 秒 然后再次播放动画 想象一下car从 x2 移动到 x3 等 the car循环是通过向汽车左侧添加 1px 来实现的 值 但我无法弄清楚嵌套循
  • 如何制作实时jquery效果?

    我想制作一个实时提要阅读器 并且我想要一个解决方案 使新项目无需刷新页面即可出现 并且具有像friendfeed一样的滚动效果 你可以在这里看到我在说什么 http www vimeo com 4029954 http www vimeo
  • FB.getLoginStatus() 不起作用

    我正在尝试编写一段代码来检查用户是否登录 发现FBJS API中有一个内置方法 叫做getLoginStatus 我已经在html中实现了它 但出于某种原因 getLoginStatus 内部的alert 不会被触发 我也尝试在 init
  • 让管道自我刷新角度

    我有来自后端的静态时间戳 我想每 1 秒刷新一次管道以获取现在的日期 这是我的烟斗 import Pipe PipeTransform from angular core import moment from moment Pipe nam
  • 如何在javascript中设置从数据库输入的最大数量?

    我希望根据数据库中的数量设置 输入类型 数字 中输入的最大数量 目前 我正在尝试让它在数据最大的基础上工作 然后再尝试从数据库中获取最大值 但它似乎无法工作 之前已经在这里问过 但我仍然无法理解 在 php javascript 中设置数据
  • 如何缩放到高图中的特定点

    Highmaps highcharts 是一个 javascript jquery 适配器 可在浏览器等中呈现地图 我有一张突出显示单个国家 地区的地图 但是 世界 地图的比例如此之大 因此我想在将地图加载到相关国家 地区后进行放大 看看
  • IE 中带有“删除”方法的 jQuery.ajax 问题

    我有一个页面 用户可以使用按钮编辑各种内容并选择触发 ajax 调用 特别是 一个操作会导致远程调用一个 url 其中包含一些数据和 放置 请求 这 因为我使用的是宁静的 Rails 后端 会触发我的更新操作 我还有一个删除按钮 它调用相同
  • 如果列表在初始化之前为空,则 jQuery 可排序无法与水平列表正常工作

    如果我在初始化后将元素添加到列表中 sortable它无法正常工作 参见示例jsFiddle http jsfiddle net NQMPr 1 示例 HTML div class container div br

随机推荐