2016-03-29 16 views
0

ここには8行の単純な文字列があります。文字列の行数が表示されます

Lorem ipsum dolor sit amet. 
Ut doloremque omnis quibusdam nam. 
Ex voluptas sapiente est. Possimus! 
Esse accusantium maxime perferendis, incidunt. 
Non, et aliquid reiciendis pariatur? 
Delectus facere odio quo tenetur? 
Accusamus magni, nulla velit. Exercitationem! 
Odit, quia. Qui, sequi, eius. 

私は行を数え、それをコンソールにするためにforループを使用しています。

$("#list-ol").on("click", function() { 
    var selected_text = mdEditor.getSelection() 

    for(i = 0; i < selected_text.split("\n").length; i++) { 
    count = i + 1 
    console.log(count) 
    } 
    mdEditor.focus() 
}) 

要するに、ボタンをクリックすると、選択範囲を置き換えてリストとして挿入したいと考えています。

目標

A list of stuff 

    1. Lorem ipsum dolor sit amet. 
    2. Ut doloremque omnis quibusdam nam. 
    3. Ex voluptas sapiente est. Possimus! 
    4. Esse accusantium maxime perferendis, incidunt. 
    5. Non, et aliquid reiciendis pariatur? 
    6. Delectus facere odio quo tenetur? 
    7. Accusamus magni, nulla velit. Exercitationem! 
    8. Odit, quia. Qui, sequi, eius. 

誰も私が注文したリストの中に私の文字列を回す助けることができますか?

ご協力いただきまして誠にありがとうございます。

// Initialize CodeMirror editor 
 
var mdEditor = CodeMirror.fromTextArea(document.getElementById("mdEditor"), { 
 
    mode: "text/x-markdown", 
 
    theme: "default", 
 
    tabMode: "indent", 
 
    styleActiveLine: true, 
 
    lineNumbers: true, 
 
    lineWrapping: true, 
 
    autoCloseTags: true, 
 
    foldGutter: true, 
 
    dragDrop: true, 
 
    gutters: ["CodeMirror-linenumbers"], 
 
    extraKeys: { 
 
    "Enter": "newlineAndIndentContinueMarkdownList" 
 
    } 
 
}) 
 

 
CodeMirror.commands.olSelection = function(cm) { 
 
    var counter = 1 
 
    var from = cm.getCursor("from").line, to = cm.getCursor("to").line 
 
    for (var line = to; line >= from; line--) 
 
    cm.replaceRange(" "+ counter++ +" ", {line: line, ch: 0}) 
 
    } 
 
$("#list-ol").on("click", function() { 
 
    mdEditor.execCommand("olSelection") 
 
})
@import url("http://codemirror.net/lib/codemirror.css"); 
 

 
html, body { 
 
    padding: 0; 
 
    margin: 0; 
 
} 
 

 
.CodeMirror { 
 
    float: left; 
 
    width: 100%; 
 
}
<script src="http://codemirror.net/lib/codemirror.js"></script> 
 
<script src="http://codemirror.net/addon/edit/continuelist.js"></script> 
 
<script src="http://codemirror.net/addon/mode/overlay.js"></script> 
 
<script src="http://codemirror.net/mode/xml/xml.js"></script> 
 
<script src="http://codemirror.net/mode/markdown/markdown.js"></script> 
 
<script src="http://codemirror.net/mode/gfm/gfm.js"></script> 
 

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

 
<button id="list-ol">List my selection</button> 
 

 
<textarea id="mdEditor">My custom list 
 
Lorem ipsum dolor sit amet. 
 
Ut doloremque omnis quibusdam nam. 
 
Ex voluptas sapiente est. Possimus! 
 
Esse accusantium maxime perferendis, incidunt. 
 
Non, et aliquid reiciendis pariatur? 
 
Delectus facere odio quo tenetur? 
 
Accusamus magni, nulla velit. Exercitationem! 
 
Odit, quia. Qui, sequi, eius.</textarea>

答えて

0

織り - http://kodeweave.sourceforge.net/editor/#1e2d096de915627ee15562260217e767

はしばらくかかったが、私はそれを考え出しました!

var str = "Lorem ipsum dolor sit amet.<br>Ut doloremque omnis quibusdam nam.<br>Ex voluptas sapiente est. Possimus!<br>Esse accusantium maxime perferendis, incidunt.<br>Non, et aliquid reiciendis pariatur?<br>Delectus facere odio quo tenetur?<br>Accusamus magni, nulla velit. Exercitationem!<br>Odit, quia. Qui, sequi, eius." 
 
var i, len, text; 
 
for (i = 0, len = str.split("<br>").length, text = ""; i < len; i++) { 
 
    text += i + 1 + ". " + str.split("<br>")[i] + "<br>" 
 
} 
 

 
document.body.innerHTML = text

関連する問題