javascript - PHP - HTML - Javascript - 按 Enter 按钮从文本区域提交文本

Question

我正在使用 html-php-javascript 进行简单的聊天。我想将文本从文本区域提交到日志文件，因为“聊天框”将从那里加载聊天内容。

我编写了在“admin_post.php”的文本区域中提交文本的代码，并且它有效。

但是，管理员只能通过按“发送”按钮来做到这一点。是否可以制作javascript，以便当管理员按键盘上的“enter”时，它会像按表单中的“发送”按钮一样执行操作？

这是 admin_post.php 中的 html 代码:

<form id="admintextform" name="message" action="">
            <?php $adminmsg = !empty($_POST['adminmsg']) ? $_SESSION['adminmsg'] : '';?>
            <textarea class="admintextarea" name="adminmsg" id="adminmsg" size="63" /><?php echo $adminmsg; ?></textarea>
            <input name="adminsubmitmsg" type="submit"  id="adminsubmitmsg" value="Send" />
        </form>

对于“发送”按钮脚本:

<script type="text/javascript">
        //If user submits the form
        $("#adminsubmitmsg").click(function(){  
        var adminmsg = $("#adminmsg").val();
            $.post("admin_post.php", {text: adminmsg});             
            $("#adminmsg").attr("value", "");
            return false;
        });
</script>

我已经尝试过下面的脚本来解决我的问题，但它不起作用。我希望下面的 javascript 能够与上面的“发送”按钮脚本完全相同，只需按键盘上的 Enter 按钮即可。

<script type="text/javascript">
        $("#admintextarea").keypress(function (e) {
            if(e.which == 13 && !e.shiftKey) {
                var adminmsg = $("#adminmsg").val();
                $.post("admin_post.php", {text: adminmsg});             
                $("#adminmsg").attr("value", "");
                return false;
            }
        });
</script>

请帮助我，感谢您的宝贵时间。 :)

Answer 1

首先，您的 HTML 存在问题。您已在打开时关闭了 textarea 标签。

对于解决方案，我希望你能找到这个JSFiddle有帮助。代码如下:

$("#adminmsg").on('keypress', function(e){
  if (e.which == 13)
  {
    e.preventDefault();
    console.log($(this).val());
    $(this).val("");
  }
});

要点:

1. 您的选择器有误。 # 对应于 ID，. 对应于类。
2. 您的代码可能会在文档完全加载之前运行；因此它找不到要绑定(bind)的元素。使用 on 来代替在页面上随时绑定(bind)到相应的选择器；或者使用将您的代码放在 $(document).ready(function(){/* your code */}); 中，以便在页面完全加载并准备就绪后执行。