向Chatbox隐藏div

Question

因此，基本概念是，每当用户键入任何消息并按enter键时，他的消息就会出现在chatbox中，但问题是，空消息(只有spacebars>1)也出现在一个框中。我怎么能隐藏一个只有空格的div。

这是代码

var message = document.getElementById("tarea");

var textbox = document.getElementById("box");
message.addEventListener("click", nayaText);
message.addEventListener("keyup", textSend);

function nayaText() {
    if (message.value != " ") {
        let naya = document.createElement("div");
        naya.style.width = "100px";
        naya.style.height = "30px";
        naya.style.border = "1px solid rgb(255, 153, 0)";
        naya.style.marginTop = "4px";
        naya.innerHTML = message.value;
        textbox.appendChild(naya);
        message.value = " ";
    }
    if (!message.trim().length) {
        naya.style.display = "none";
        message.value = " ";
    }


}


function textSend() {

    if (event.keyCode === 13) {
        event.preventDefault();
        message.click();
    }
}

HTML部件

<div class="card">
<div class="card-header bg-warning">
   <img id="profilep" class="rounded-circle" src="as.jpg">
   <div id="info">
      <label id="uname">Suraj Surya</label><br>
      <label id="lastseen">12:00am</label>
   </div>
</div>
<div class="card-body ">
   <div class="box" id="box"></div>
</div>
<div class="card-footer">
   <span><i id="paisa" class="fas fa-rupee-sign"></i></span>
   <span><input type="text" placeholder="type here..." id="tarea" required  ></input></span>
   <span><i id="more" class="fas fa-chevron-up"></i></span>
</div>

Answer 1

一定是

if(message.value!=" ")

部分。我会修剪信息，并将其与空字符串进行比较。

if((message.value.trim())!=="")