javascript - 检查 contenteditable div 是否为空

Question

我有一个内容可编辑的 div，用作 Textarea。

<div id="divThatYouCanWriteStuffIn" contenteditable="true" class="ibox-content col-lg-12">
</div>

现在我想检查这个 div 是否为空，以进行验证。

我使用的是如下。

 if ($('#divThatYouCanWriteStuffIn')[0].innerText == "") {
        alert("Please update your wall, then post.")
        return false;
  }

但如果用户只是在 div 中单击输入，它就不起作用。和我用的一样

 if ($('#divThatYouCanWriteStuffIn')[0].innerText.length <= 1) {
        alert("Please update your wall, then post.")
        return false;
    }

$('#divThatYouCanWriteStuffIn').html()

但是它在div中也有break标签，因为它以空白作为break

那么，有什么方法可以检查可编辑的 div 是否为空并且有一些正确的文本？

Answer 1

可以使用text()方法获取相关内容(不带html标签的内容)

  if ($('#divThatYouCanWriteStuffIn').text().trim().length == 0) {
    alert("empty");
  }

.trim() 函数从内容的开头和结尾删除所有空格和换行符。

Fiddle