HTML5:具有阻塞高度的 contenteditable div 以及当文本到达底部时创建新的 div

发布于 2024-12-27 04:24:22 字数 206 浏览 4 评论 0原文

我想知道如何避免当用户在内部键入字符超过 DIV 高时,宽度和高度固定尺寸且允许内容可编辑功能的 DIV 不会增加其高度。事实上,即使尝试定义一个固定的高位,我也注意到用单词填充整个 DIV 空间并简单地超出浏览器会自动增加 DIV 高位。相反,我需要一个阻塞的 DIV 高,不出现滚动条,最终我希望在达到上限的事件 reacehd 上创建一个新的 DIV,其中将放置并显示用户字符流。有人知道吗?

I'm wondering how to avoid that a DIV with fixed dimensions on width and high and allowed contenteditable feature does not increase its high when the user, typing characters inside, exceed the DIV high. In fact, even trying to define a fixed high I notice that filling the entire DIV space with words and going simply beyond the browser automatically increases the DIV high. On the contrary I need a blocked DIV high, no scroll bar appearing, and eventually I would like that a new DIV would be created on the high limit reached event reacehd where the user characters flow will be put and displayed. Does anyone have any idea?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

南风起 2025-01-03 04:24:22

如果正确设置 css,div 可以保持其定义的高度:

<div style="border:1px solid black; height:100px; overflow:hidden" contentEditable="true">
line 1 type here<br>
   line 2<br>
   line 3<br>
   line 4<br>
   line 5<br>
   line 6<br>
</div>    

关于在内容高于允许的高度时创建新的 div,您必须创建一些函数来检查这些值并采取相应的操作。

The div can keep its height as defined if you set the css correctly:

<div style="border:1px solid black; height:100px; overflow:hidden" contentEditable="true">
line 1 type here<br>
   line 2<br>
   line 3<br>
   line 4<br>
   line 5<br>
   line 6<br>
</div>    

With regards to creating a new div when the contents is higher than the allowed height, you'll have to create some function that checks those values and acts accordingly.

So尛奶瓶 2025-01-03 04:24:22

添加此 CSS 属性

 white-space: nowrap;
    overflow: hidden;

Add this CSS Properties

 white-space: nowrap;
    overflow: hidden;
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文