2011-11-16 2 views
1

jHtmlArea를 사용하고 있습니다. iframe/document 편집 모드를 사용하는 모든 html 텍스트 상자와 관련이 있습니다.Javascript - jHtmlArea, 커서 위치 설정

pasteHTML 함수를 사용하여 jHtmlArea에 텍스트를 설정 했으므로 삽입 한 텍스트 뒤에 커서를 놓고 싶습니다. 이렇게하는 좋은 방법이 있습니까?

답변

2

jHtmlArea의 pasteHTML 구현을 브라우저 스니핑을 사용하지 않고 브라우저간에 일관되게 동작하고 삽입 된 내용 뒤에 캐럿을 배치하는 것이 좋습니다. 다음과 같은 뭔가가 여기 내 대답에서 적응 : Insert html at caret in a contenteditable div

jHtmlArea.prototype.pasteHTML = function(html) { 
    var sel, range, iframe = this.iframe[0], 
     win = iframe.contentWindow || iframe.contentDocument.defaultView, 
     doc = win.document; 

    win.focus(); 
    if (win.getSelection) { 
     // IE9 and non-IE 
     sel = win.getSelection(); 
     if (sel.getRangeAt && sel.rangeCount) { 
      range = sel.getRangeAt(0); 
      range.deleteContents(); 

      // Range.createContextualFragment() would be useful here but is 
      // not supported in all browsers (IE9, for one) 
      var el = document.createElement("div"); 
      el.innerHTML = html; 
      var frag = doc.createDocumentFragment(), node, lastNode; 
      while ((node = el.firstChild)) { 
       lastNode = frag.appendChild(node); 
      } 
      range.insertNode(frag); 

      // Preserve the selection 
      if (lastNode) { 
       range = range.cloneRange(); 
       range.setStartAfter(lastNode); 
       range.collapse(true); 
       sel.removeAllRanges(); 
       sel.addRange(range); 
      } 
     } 
    } else if ((sel = doc.selection) && sel.type != "Control") { 
     // IE < 9 
     sel.createRange().pasteHTML(html); 
    } 
} 
+0

이것은 기본 pasteHTML 방법에 대한 훌륭한 대안입니다. 그것은 정말 잘 작동합니다. IE7/8/9, Firefox, Chrome에서 테스트되었습니다. – Rob