css 按空格键对按钮暂停,当按下回车键后，怎么清空回车键的空格，或者模拟发送按键让光标向上？...

问题：当按下回车键发送信息后，光标会跑到第二行，怎么让光标在按下回车键后回到第一行首？

目前想到的两种方案：

第一：回车后，模拟发送按键，让光标向上

第二：清空输入框的所有html，此方法测试无效

求大神能给出代码，谢谢

QQ聊天面板，发送信息，选中联系人

body{

background: #fff !important;

color:#747474;

}

.textbox{

bottom:85px;

border-top: 1px solid #747474;

width: 741px;

}

button.btn.confirm {

float: right;

margin-right: 15px;

padding: 4px 20px;

background: #4d9be0;

color: #fff;

border: 1px;

cursor: pointer;

}

button.btn.confirm:hover{

background:#2e76b5;

}

textarea{

width:97%;

height:55px;

border: 0;

outline: none;

resize:none;

padding: 8px;

}

/*滚动条垂直方向的宽度*/

::-webkit-scrollbar

{

width: 2px;

}

/* 垂直滚动条的滑动块 */

::-webkit-scrollbar-thumb:vertical {

border-radius: 4px;

-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);

background-color:rgba(129,129,129,0.5);

}

.wrap{

width:960px;

height: 555px;

margin:40px auto;

font-size: 14px;

}

.box_left{

width:207px;

height:555px;

border:1px solid #797979;

float: left;

}

.title_left{

background:#f4f4f4;

border-bottom:1px solid #797979;

padding:10px;

}

.content_left{

/*overflow: auto;*/

height: 507px;

/*border: 1px solid #c5c5c5;*/

overflow-y: scroll;

}

.content_left img{

margin-right: 6px;

}

.content_left ul{

padding:6px 6px;

}

.content_left ul li{

line-height: 34px;

padding: 5px;

}

.content_left ul li:hover{

background:#f4f4f4;

}

.user_img{

width:36px;

height: 36px;

border-radius: 2px;

}

.box_right{

width:743px;

height:555px;

border:1px solid #797979;

float: right;

}

.title_right{

padding:10px;

text-align: center;

background:#f4f4f4;

border-bottom: 1px solid #797979;

}

.content_right{

padding:7px 25px;

margin-bottom:30px;

overflow: auto;

height: 355px;

}

.message_time{

text-align: center;

}

.message_left{

position: relative;

margin-bottom:30px

}

.message_left_content{

background:#e8c088;

padding:8px;

color:#fff;

border-radius: 4px;

margin-left: 8px;

position: absolute;

word-wrap: break-word;

min-height: 25px;

}

.message_right{

float:right;

position: relative;

margin-bottom: 30px;

width:80%;

padding-right: 36px;

text-align:right;

}

.message_right img{

/* float: right; */

position: absolute;

right:0;

top:0;

}

.message_right_content{

background: #4e9be0;

padding: 8px;

color: #fff;

border-radius: 5px;

margin-right: 8px;

display: inline-block;

/*position: absolute;*/

right: 38px;

word-wrap:break-word;

word-break:break-all;

}

.face{

bottom:10px;

left:20px;

width:30px;

height:30px;

cursor: pointer;

padding-left: 20px;

}

/*表情插件*/

.comment{width:680px; margin:20px auto; position:relative; background:#fff; padding:20px 50px 50px; border:1px solid #DDD; border-radius:5px;}

.comment h3{height:28px; line-height:28px}

.com_form{width:100%; position:relative}

.input{width:99%; height:60px; border:1px solid #ccc}

.com_form p{height:28px; line-height:28px; position:relative; margin-top:10px;}

span.emotion{width:42px; height:20px; background:url(http://www.16code.com/cache/demos/user-say/img/icon.gif) no-repeat 2px 2px; padding-left:20px; cursor:pointer}

span.emotion:hover{background-position:2px -28px}

.qqFace{margin-top:4px;background:#fff;padding:2px;border:1px #dfe6f6 solid;}

.qqFace table td{padding:0px;}

.qqFace table td img{cursor:pointer;border:1px #fff solid;}

.qqFace table td img:hover{border:1px #0066cc solid;}

#show{width:770px; margin:20px auto; background:#fff; padding:5px; border:1px solid #DDD; vertical-align:top;}

.sub_btn {

position:absolute; right:0px; top:0;

display: inline-block;

zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */

*display: inline;

vertical-align: baseline;

margin: 0 2px;

outline: none;

cursor: pointer;

text-align: center;

font: 14px/100% Arial, Helvetica, sans-serif;

padding: .5em 2em .55em;

text-shadow: 0 1px 1px rgba(0,0,0,.6);

-webkit-border-radius: 3px;

-moz-border-radius: 3px;

border-radius: 3px;

-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);

-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);

box-shadow: 0 1px 2px rgba(0,0,0,.2);

color: #e8f0de;

border: solid 1px #538312;

background: #64991e;

background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));

background: -moz-linear-gradient(top, #7db72f, #4e7d0e);

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');

}

.sub_btn:hover {

background: #538018;

background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));

background: -moz-linear-gradient(top, #6b9d28, #436b0c);

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');

}

.face img{

width: 25px;

}

.facemore{

width:320px;

padding:8px;

border:1px solid #ddd;

overflow: hidden;

top:30px;

left:24px;

position: absolute;

background: #fff;

}

.facemore img{

float: left;

padding-bottom: 3px;

}

.info{

position:relative;

/*padding-top: 8px;*/

}

.message_right .message_right_content img{

position:relative;

}

#textarea{

height:66px;

padding:8px;

overflow: scroll;

outline: none;

}

$(document).ready(function() {

// 自定义开关，开关表情面板

var onOff=true;

$(".face").click(function() {

// 添加表情面板

var onOff=true;

if(onOff){

// 显示表情框

$(this).after('

var value="";

for(var num=1;num<76;num++){

value='';

$(".facemore").append(value);

}

// 点击表情显示在文本框内

$(".facemore a").click(function(){

$("#textarea").append($(this).html());

//点击表情后，隐藏表情面板

$(".facemore").hide();

});

onOff=false;

}

else{

//删除表情面板

$(".facemore").remove();

onOff=true;

}

});

// 发送按钮

function sent(){

//获取内容；

var $val= $("#textarea").html();

// 判断发送的内容是否为空，为空不发送；

if($val==''){

return

}

else{

// 把内容添加到聊天窗口中

$(".content_right").append("

"+$val+"

");

// 100毫秒后，内容到底部

setTimeout("$('.content_right').scrollTop( $('.content_right')[0].scrollHeight )",100)

// 清空输入框中的内容

$("#textarea").html('');

}

};

// 当点击发送按钮一发送信息；

$(".confirm").on('click',sent);

// 输入框自动获得焦点；

$("#textarea").focus();

//当按下回车键发送信息；

$("#textarea").keydown(function(ev){

var ev=ev||window.event;

if(ev.keyCode==13) {

sent();

}

})

// 当回车键后光标到输入框顶部；

// $("#textarea").keyup(function(ev){

// var ev=ev||window.event;

// ev.keyCode==37;

// }

// 文本输入框函数；

$(".content_left li").click(function(){

//找要要的属性值

var $val2=$(this).find("span").html();

var $img=$(this).find("img").attr("src");

// 给要添加的地方

$(".title_right").html($val2);

$(".content_right").html("");

})

});

近期会话

• 周杰伦1

• JJ

易董君

2016/7/18 13:28:25

这是测试文本这是测试文本这是测试文本这是测试文本

22

蝴蝶日历木要蝴蝶日历木要蝴蝶日历木要蝴蝶日历木要蝴蝶日历木要蝴蝶日历木要蝴蝶日历木要蝴蝶日历木要

发送