contenteditable

Question

currentDiv 是 div 里面有插入符号
在按钮上单击我需要添加一个 class
问题 - 如何获得哪个 div 是当前的？

$('button').on('click', function(){
$(currentDiv).addClass('indent');
});

.indent{margin-left:30px;}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div contenteditable>
<div>lorem</div>
<div>ipsum</div>
<div>dolor</div>
</div>

<button>CLICK</button>

Answer 1

可以使用Range和startContainer属性来获取光标指向的元素：

const contenteditable = $('[contenteditable]');
$('button').on('click', function(e) {
  var sel = window.getSelection();
  var range = sel.getRangeAt(0);
  var elem = range.startContainer.parentNode;
  $(elem).addClass('indent');
});

.indent {
  margin-left: 30px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div contenteditable>
  <div>lorem</div>
  <div>ipsum</div>
  <div>dolor</div>
</div>

<button>CLICK</button>

contenteditable - 将 class 添加到当前 div

contenteditable - add a class to a current div

javascript

jquery