jQuery之可编辑div--contenteditable

一、获取div contenteditable的内容

1、获取纯文本内容

$(document).off("click",".mdc_mrtpm_mainTitle").on("click",".mdc_mrtpm_mainTitle",function(){
  var thisText = $(this).find(".J_edit_tit").text().trim();
  console.log(thisText);
});

获取纯文本内容

2、获取html内容

$(document).off("click",".mdc_mrtpm_mainTitle").on("click",".mdc_mrtpm_mainTitle",function(){
  var thisHtml = $(this).html();
  console.log(thisHtml);
});

获取html内容

二、div contenteditable 重新编辑时focus光标定位到前面

说明：仅仅是 $(" ").focus(); 不能解决问题

1、HTML

<div class="editdiv" id="edit" contenteditable="true">这是添加文字</div>

2、JQuery

function getC(el){

    el = el[0]; // jquery 对象转dom对象

    el.focus();

    var range = document.createRange();

    range.selectNodeContents(el);

    range.collapse(false);

    var sel = window.getSelection();

    //判断光标位置，如不需要可删除

    if(sel.anchorOffset!=0) return;

    sel.removeAllRanges();

    sel.addRange(range);

}

开始调用：getC($('.editdiv'))