Question

我有一个使用textarea而不是文本的聊天，原因很明显。这就是每次成员点击ENTER时他们得到一个新行而不是发送消息的原因。我想改变它，所以每次他们点击ENTER =要提交的消息然后光标返回textarea以便他们下一个消息输入。我尝试过在这个网站上找到的不同代码，大多数都没有用，而那些似乎做某事的人只是刷新页面而且我得到了一个空白页。

我的代码：

<form name="message" action="">
    <textarea name="usermsg" autocomplete="off" type="text" id="usermsg" rows="4" cols="30" style="width: 450px; margin-left: 25px;">
    </textarea>
    <br/>

    <p style="margin-left: 420px;"><input name="submitmsg" type="submit"  id="submitmsg" value="Send" /></p>
</form>

非常感谢你的时间。

Answer 1

试试这个（注意当你按下ENTER然后提交，但是SHIFT + ENTER会换行。

$("#textareaId").keypress(function (e) {
    if(e.which == 13 && !e.shiftKey) {        
        $(this).closest("form").submit();
        e.preventDefault();
        return false;
    }
});

Answer 2

我创建了一个jsfiddle，其中包含如何使用jQuery以及keypress函数和which属性执行此操作的示例：http://jsfiddle.net/GcdUE/

不确定您要求的更多内容，请尽可能进一步说明您的问题。

$(function() {
    $("#usermsg").keypress(function (e) {
        if(e.which == 13) {
            //submit form via ajax, this is not JS but server side scripting so not showing here
            $("#chatbox").append($(this).val() + "<br/>");
            $(this).val("");
            e.preventDefault();
        }
    });
});

Answer 3

Vanilla JavaScript解决方案

function submitOnEnter(event){
    if(event.which === 13){
        event.target.form.dispatchEvent(new Event("submit", {cancelable: true}));
        event.preventDefault(); // Prevents the addition of a new line in the text field (not needed in a lot of cases)
    }
}

document.getElementById("usermsg").addEventListener("keypress", submitOnEnter);

如果您不想提交单击Shift，则只需将第2行更改为：

if(event.which === 13 && !event.shiftKey){

要清除textarea，只需将其添加到if语句主体

中

event.target.value = "";

要在Internet Explorer 11中使用此功能，请将第3行更改为：

var newEvent = document.createEvent("Event");
newEvent.initEvent("submit", false, true);
event.target.form.dispatchEvent(newEvent);

但等等？为什么不使用event.target.form.submit();？

当您调用表单的submit方法时，不会调用事件侦听器。

Answer 4

好吧，假设你使用的是jquery，那么你的输入字段就是一个简单的监听器：

在＆lt; / body＆gt;之前的页脚中：

<script type="text/javascript">
$(document).ready(function(){
    $('#usermsg').keypress(function(e){
      if(e.which == 13){
           // submit via ajax or
           $('form').submit();
       }
    });
});
</script>

在你的html头中添加：

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>

但如果js或jquery不可能，那么可能会更新您的问题以明确排除它。

Answer 5

function KP()
{    
var x = event.keyCode;
   if(x==13)
        {
            // alert (x);
            document.message.submit();
        }
}

php

echo '<textarea  name="usrMsg" id="usrMsg" OnKeyPress="KP();">'txt'</textarea>';

Answer 6

使用<input type=text>代替<textarea>。然后你有更好的机会。在textarea中，按Enter键应该表示文本中的换行符，而不是文本的提交。

如何在textarea中输入“Enter”键提交表格

6 个答案: