我创建了一个带提交按钮的聊天框,但文本区域失去了关注点击提交按钮

时间:2017-05-15 08:29:42

标签: javascript jquery html chat

在我的移动网站上,我有一个聊天功能,基本上有一个显示区域,要写的文本区域和一个发送按钮来提交文本,问题是当我在文本区域中写入文本时弹出的移动键盘和我点击发送按钮它失去焦点并提交移动文本和键盘消失我的要求是单击发送按钮时键盘不应消失。

3 个答案:

答案 0 :(得分:1)

您可能正在使用click()函数发送消息,对于触控设备,您只需使用'touchend'事件,如下所示:

$(document).on('touchend', 'selector' ,function(){
    //you code goes here
});

现在你的重点将放在textarea上。 希望这会有所帮助。

答案 1 :(得分:0)

您可以覆盖onsubmit元素的<form>函数。 默认情况下,表单会删除所有<input>的内容,并将内容发送到action属性中指定的内容。 如果要覆盖此行为,只需在preventDefault事件上调用submit方法即可。样品:

&#13;
&#13;
var form = document.getElementById('my-form');
var input = document.getElementById('my-input');

form.onsubmit = function (event) {
  // Prevent the form from sending the content
  // and deleting it afterwards
  event.preventDefault();
  
  // Focus the input element again
  input.focus();
  
  // Send the content via ajax to your endpoint
  alert('sending content...');
}
&#13;
<form id="my-form" action="/message" method="POST">
  <input type="text" id="my-input" />
  <input type="submit" value="send" />
</form>
&#13;
&#13;
&#13;

答案 2 :(得分:0)

将输入文本区域对焦,以便您可以专注于文本区域,并在屏幕上显示键盘。

在您提交数据的java脚本函数中使用input.focus()。如果您直接提交数据然后更改代码,并在ajax请求和响应完成之后再次关注文本框