【Web前端问题】<textarea> 标签内存在换行符问题
今天在做一个功能,模仿 QQ 发送消息的形式,可以按下 Enter 或者 Ctrl+Enter 发送消息。但是做的过程中发现一个问题,按 Enter 键发送消息后,<textarea>标签里的消息内容可以被发送,但是发送之后的 textarea 区域却始终会显示一个换行。而使用 Ctrl+Enter 发送消息不会出现问题。(发送消息的方法在发送之后会清空 textarea 里的内容并获取焦点)。代码及效果如下截图:
<textarea class="form-control" rows="5" id="content" placeholder="send message"></textarea>
处理按键方法:
var send_method = 'e'; $('textarea').keydown(function(e) {
if (send_method == 'e') {
if (e.keyCode == 13) {
onSubmit(); //发送消息
}
} else {
if (e.ctrlKey && e.keyCode == 13) {
onSubmit();
}
}
});
发送消息的方法:
function onSubmit() { //发送消息
$('textarea').val('');
$('textarea').focus();
}
使用 Enter 发送后效果:
使用 Ctrl+Enter 发送后:
所以我不清楚为什么使用 Enter 发送后始终会有一个换行以及如何去掉?
回答:
$('textarea').keypress(function(event) { // Check the keyCode and if the user pressed Enter (code = 13)
// disable it
if (event.keyCode == 13) {
event.preventDefault();
}
$(this).text('hello');
});
回答:
请了解keydown
、keypress
和keyup
这三个事件的触发时机。
以上是 【Web前端问题】<textarea> 标签内存在换行符问题 的全部内容, 来源链接: utcz.com/a/142149.html