1

我有一个初始大小的文本输入，比如 2。我想要的是，当我输入它时，大小应该同时扩大（由于文本输入的边框而可见），并在用户按下退格/删除时同时减小删除字符。我正在尝试使用此代码：

$("input").live("mouseup mousedown keyup keydown",function() {
x = parseInt($(this).attr('size'));
y = $(this).val().length;
z = x > y ? y : x;
$(this).attr('size',z+2);
});

现在，当用户一次键入一个字符或按下一个字符键并保持按下时，此代码将按预期工作。当我从某个地方复制一大块文本，关注文本输入，然后通过 CTRL-V 或右键单击并选择“粘贴”选项粘贴到其中时，就会出现问题。我正在用一串 45 W 测试它。发生的情况是文本输入只扩展了一点并且保持这种状态（因此只显示几个 W）。直到我点击它，它才会扩大一点。2 或 3 次后续点击继续扩大它，然后它最终扩大到完整尺寸。另一个奇怪的事情是反过来不是真的，当我专注于输入时，按 CTRL-A 选择整个文本并按退格键，大小减小到原始大小，同时所有文本都消失了。谁能解释为什么会这样？当粘贴一大块文本时，如何同时自动扩展它？

4

4 回答 4

1

您可以尝试使用 'editable' div，如下所示：

CSS：

div.input{
   display:inline-block; 
   border:1px solid; 
   background-color:white;
}

​<em>标记：

<div class="input" contentEditable="true">Type here...</div>​

演示-> 在这里

于 2012-06-22T08:41:19.147 回答
0

而不是.live("mouseup mousedown keyup keydown")我会使用以.change()相同方式工作的事件，并且可能也会捕获 CTRL+V 更改。

于 2012-06-22T08:43:17.450 回答
0

改用事件propertychange（IE）和input（其他）。

于 2012-06-22T08:50:09.060 回答
0

另一个技巧，也许更交叉兼容，是用计时器触发检查。

于 2012-06-22T08:50:56.677 回答