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

Answer 2

请填写您的contenteditable div包含HTML。我用下面这个方法

divHtml = $('div#divThatYouCanWriteStuffIn').html();
checkEmpty = divHtml.replace(' ', '').replace('<br>', '');
if(checkEmpty.length == 0){
    alert('empty');
}

将所有空格替换为所有空格，并将所有换行符<br>替换为

检查contenteditable div是否为空

2 个答案: