问题:当按下回车键发送信息后,光标会跑到第二行,怎么让光标在按下回车键后回到第一行首?
目前想到的两种方案:
第一:回车后,模拟发送按键,让光标向上
第二:清空输入框的所有html,此方法测试无效
求大神能给出代码,谢谢
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="description" content=""> <meta name="keywords" content=""> <!-- <script src="css/jquery.min.js" type="text/javascript"></script> --> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <link href="css/center.css" rel="stylesheet" type="text/css"> <title>QQ聊天面板,发送信息,选中联系人</title> <style type="text/css"> 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=
触发onkeydown事件,判断e.keycode是不是enter键,是的话,e.preventDefault()
一周热门 更多>