2016-09-08 4 views
2

私は現在summernote 0.8.2を使用していますが、テキストがあらかじめロードされているノートを使用しています。テキストが読み込まれるとき、私はそれをフォーカスしたいが、行末に焦点を当てたい。私はAPIに基づいて焦点を合わせようとしました。しかし、私は集中しようとしましたが、それは行末に開始しません。以下は、this質問に基づいて何をやってみたかの例です。助けてください。 (私は「項目2」の後になるようにカーソルを希望)Summernoteテキストの終わりにフォーカスする方法

$("#myNote").summernote({ 
 
      toolbar: [ 
 
       ['para', ['ul']] 
 
      ], 
 
      focus: true 
 
     }); 
 
$('.note-editor [data-event="insertUnorderedList"]').tooltip('disable'); 
 

 
$('.note-btn.btn.btn-default.btn-sm').attr('data-original-title',''); 
 

 

 
var html = "<ul><li>item 1</li><li>item 2<br></li></ul>"; 
 
$("#myNote").summernote('code',html); 
 
$("#myNote").focus();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.2/summernote.js"></script> 
 
<script> 
 
$(document).ready(function() { 
 
    $.fn.extend({ 
 
     placeCursorAtEnd: function() { 
 
      // Places the cursor at the end of a contenteditable container (should also work for textarea/input) 
 
      if (this.length === 0) { 
 
       throw new Error("Cannot manipulate an element if there is no element!"); 
 
      } 
 
      var el = this[0]; 
 
      var range = document.createRange(); 
 
      var sel = window.getSelection(); 
 
      var childLength = el.childNodes.length; 
 
      if (childLength > 0) { 
 
       var lastNode = el.childNodes[childLength - 1]; 
 
       var lastNodeChildren = lastNode.childNodes.length; 
 
       range.setStart(lastNode, lastNodeChildren); 
 
       range.collapse(true); 
 
       sel.removeAllRanges(); 
 
       sel.addRange(range); 
 
      } 
 
      return this; 
 
     } 
 
    }); 
 
}); 
 
</script> 
 
<link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.2/summernote.css" rel="stylesheet"/> 
 
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script> 
 
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet"/> 
 

 

 
<div id="myNote"></div>

答えて

0

代わりに初期化さSummernoteエディタにフォーカスメソッドを呼び出すの、カスタムjQueryのメソッドの代わりにplaceCursorAtEnd呼び出してみてください。

私自身は、これらの線に沿って何かをやっている:this.advancedEditorはオプションです

var $el = this.$el; 
$el.find('.inline-preview .component-text-editor') 
    .summernote(this.advancedEditor) 

$el.find('[contenteditable]').placeCursorAtEnd(); 

が私たちのsummernoteの初期化メソッドに渡されるオブジェクト。

関連する問題