Javascript 当用户按enter键时，自动在textarea/text中插入消息

我正在制作一个简单的聊天室，我在index.php中有一个textarea，用户可以在这里输入他/她的消息。我使用link在ajax中传递值，而不是按钮。在我的情况下，我通常单击“发送”链接以传递值。但当用户点击enter他/她的消息并自动显示到div时，我该如何解决这个问题呢

**

Index.php **

---

通常，要做的事情是添加一个“onKeyDown”处理程序，查看哪个键触发了事件，如果该键是幻数

13

即回车，则执行提交。看起来像这样：

var onKeyDown = function(e) {
  if (e.which == 13) {
    e.preventDefault();
    submitChat();
  }
};

$("#id-to-text-area").on("keydown", onKeyDown);

---

嗨，你可以这样做

    $("textarea").keydown(function(e)
{
    if (e.keyCode == 13)
    {
      submit();
    }
}

---

您可以尝试检测[name=msg]文本区域内按下返回键的时间。这是vanilla JS（但您也可以在页面底部添加它）

    <script type="text/javascript"> 
    function listenKeys(evt) { 
      var evt = (evt) ? evt : ((event) ? event : null); 
      var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null); 
      if ((evt.keyCode == 13) && (node.name=="msg"))  {
                // RETURN KEY DETECTED IN msg, EXECUTE YOUR CODE HERE
      } 
    } 

    document.onkeypress = listenKeys; 

    </script>

函数listenKeys（evt）{
var evt=（evt）？evt:（（事件）？事件：空）；
var节点=（evt.target）？evt.target:（（evt.srcement）？evt.srcement:null）；
如果（（evt.keyCode==13）&&（node.name==msg”））{
//在msg中检测到返回键，请在此处执行代码
} 
} 
document.onkeypress=listenKeys；

希望对按键事件有帮助

**Add Handle（）函数**
**Add Handle() function onkeypress event**
<form name="form1" onsubmit="submitAjaxQuery(event)" >
<textarea name="msg"></textarea><br/>
<a href="#" onclick="submitChat()" onkeypress="handle()"> Send </a>
</form>

 function handle(e){ {
    if(e.which == 13) {
        if( form1.msg.value ==''){ 
     alert("All fiels are mandatory");
return; 
}

form1.uname.readonly=true;
form1.uname.style.border='none';


var uname= form1.uname.value;  
var msg = form1.msg.value;


var xmlhttp = new XMLHttpRequest();

xmlhttp.onreadystatechange = function(){
    if(xmlhttp.readyState == 4 && xmlhttp.status ==200)
    {
     document.getElementById('chatlogs').innerHTML = xmlhttp.responseText;

    }

}

xmlhttp.open('GET','insert.php?uname='+uname+'&msg='+msg,true);
xmlhttp.send();
}
}



函数句柄（e）{{
如果（e.which==13）{
如果（form1.msg.value=''）{
警报（“所有区域都是强制性的”）；
返回；
}
form1.uname.readonly=true；
form1.uname.style.border='none'；
var uname=form1.uname.value；
var msg=form1.msg.value；
var xmlhttp=new XMLHttpRequest（）；
xmlhttp.onreadystatechange=函数（）{
if（xmlhttp.readyState==4&&xmlhttp.status==200）
{
document.getElementById（'chatlogs'）.innerHTML=xmlhttp.responseText；
}
}
open（'GET'，'insert.php？uname='+uname+'&msg='+msg，true）；
xmlhttp.send（）；
}
}

请像这样尝试

$("textarea").keypress(function(event){
             var p = event.which;           
             if(p==13){ // Enter key press
        // Your code goes here
    }
    });

---

您可以将此代码用于输入事件。此处

html代码

<form name="form1" onsubmit="submitAjaxQuery(event)" >
<textarea id="area" name="msg"></textarea><br/>
<a href="#" onclick="submitChat()"> Send </a>
</form>

更新

您可能需要添加jquery库

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

---

嗯，这很简单。什么事让你烦恼？

<form name="form1" onsubmit="submitAjaxQuery(event)" >
<textarea id="area" name="msg"></textarea><br/>
<a href="#" onclick="submitChat()"> Send </a>
</form>

$("#area").keypress(function(e) {
    if(e.which == 13) {
        submitChat();
        alert('message submit!');
    }
});

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

$("textarea").keypress(function(event) {
if (event.which == 13) {
    event.preventDefault();
    $("form").submit();
}
});