contenteditable single-line input
28 浏览
contenteditable single-line input
在我们公司开发的应用程序中，我们需要一个支持在基于JS的Web应用程序中插入表情符号的输入框。我们目前使用带有表情符号简码（例如':-)'）的输入框，并希望切换到插入实际的图形图像。
我们最初的计划是使用一个contenteditable 。我们使用监听器来处理粘贴事件以及不同的键盘/鼠标交互，以确保没有不需要的标记进入contenteditable（我们将文本从其容器标记中剥离，只留下我们自己插入的图像标记）。
然而，目前的问题是，如果输入足够的内容（即其高度增加），contenteditable会自动调整大小。我们不希望发生这种情况，也不希望文本只是被隐藏（即简单的overflow: hidden）。所以：
有没有办法让contenteditable的div表现得像单行输入框一样？
如果有一个相对简单的属性/CSS属性，我可能错过了它，我希望最好使用它来实现我想要的效果，但是如果需要，也可以提供CSS+JS的建议。