在聊天框中使用if条件

时间:2018-03-31 19:00:04

标签: javascript html css

我只是不知道如何在这里使用IF条件我也使用泡泡聊天,所以当文本字段为空时,泡泡聊天得到更新,没有任何文本。我不想要它。所以如何使用IF条件它恰当。

 window.onload = function() {
  document.getElementById("myText").focus();
  };
  function typo(){
   var currentText = document.getElementById("demo").innerHTML;
  var x = '<div><p class=bubble>' + document.getElementById("myText").value + '</p></div>';
  document.getElementById("myText").value = "";
  var y = document.getElementById("demo").innerHTML = currentText + x;
  var z = document.getElementById('demo');
  z.scrollTop = z.scrollHeight;
  }
 var input = document.getElementById("myText");
 input.addEventListener("keyup", function(event) {
  event.preventDefault();
  if (event.keyCode === 13) {
  document.getElementById("btn-chat").click();
  }
  });
<div class="container">
  <div class="row">
    <div class="panel panel-primary">
      <div class="panel-heading">
        <span class="glyphicon glyphicon-comment"></span> Chat
        <div class="btn-group"></div>
      </div>
    </div>
  </div>        
  <div class="bottom">
    <p id="demo"></p>
    <input class="widebox" type="text" id="myText" value="">
    <button onclick="typo()" class="btn btn-warning btn-sm" id="btn-chat">Send</button>
  </div>
</div>
这是demo fiddle这里

3 个答案:

答案 0 :(得分:0)

if (event.keyCode === 13 && input.value.length) ......可行吗?

答案 1 :(得分:0)

您可以检查以确保至少有1个字符的长度。

在查看您添加的演示后,您还可以使用trim()进行检查,确保空白区域消失。

if (event.keyCode === 13 && input.value.trim().length > 0) {

https://jsfiddle.net/kkjbryqe/8/

答案 2 :(得分:0)

我在我的问题下面发了一个小提琴演示..所以我可以更清楚自己在做什么,并感谢大家有时间来回顾我的问题并帮助我。我非常感谢