Question

我正在努力寻找或写一个正则表达式来解决我的问题。这是我的例子：

$(function () {
  // localStorage.clear()
  
  $('#divEditable').focusout(function () {
  
  //var content = $(this).text()
  var content = $(this).html().replace(/<(?!br\s*\/?)[^>]+>/g, '');  
  
  localStorage.setItem('div',  content)
  
  loadDiv()
  
  })
})

var loadDiv = function() {
	$('#divEditable').html(localStorage.getItem('div'))
  console.log(localStorage.getItem('div'))
}

#divEditable {
  width: 400px;
  height: 600px;
  background: grey;
  overflow: auto;
  margin-right: 20px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="divEditable" contenteditable></div>

如果我粘贴或写入带有中断的文本：

Nam luctus aliquet nunc, in dignissim neque consequat facilisis. Nullam porta congue diam sit amet accumsan. Mauris vel vulputate lacus.

Maecenas enim dolor, feugiat sed eros ac, blandit vestibulum nibh. Duis volutpat, magna ut semper fermentum, dolor nulla dignissim quam, quis placerat augue leo ut ipsum.

休息将被删除。当我输入类似这样的文本时：

1. Test list
2. Test list
3. Test list

休息和空格也将被删除。我正在寻找剥离所有文本样式，div，图像，列表等。但是，如果文本被粘贴或键入，则只保留任何形式的文本间距和文本中断。我希望这是有道理的。

纯文本+段落，br，空格

工作示例也在https://jsfiddle.net/zcwr7v2g/

由于

Answer 1

如果您没有参加比赛或使用正则表达式不是必须的，您可以使用innerText属性来获取元素的文本内容。它将保留换行符和空格。

请参阅下面的代码：

var elem = document.getElementById('div1');

console.log(elem.innerText);

<div id="div1">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco lab.
  
  <br/>
  
  Lorem ipsum dolor Lorem ipsum dolor.

  <ul>
    <li>Coffee</li>
    <li>Tea</li>
    <li>Milk</li>
  </ul>

</div>

Answer 2

最好的方法是点击此链接：https://www.sitepoint.com/jquery-set-innertext-2/

正则表达式需要删除所有HTML中断和空格

2 个答案: