Question

我有一些jQuery脚本当我点击我的#olist-button时，它会从1创建有序列表，如下所示

1. List-item
2. List-item
3. List-item

我想要实现的是当最后一个数字后面有一个换行/空行时，它会创建一个新的有序列表组并从一个开始

 1.  List item
 2.  List item
 3.  List item

 1.  List item

问题：在最后一行之后有换行符/空行时订单列表编号如何确保订单列表从一个开始试。

Codepen Demo

脚本

$(document).ready(function() {

var textarea_id = $('textarea').attr('id');

$('#olist-button').on('click', function(e) {
markdown_syntax(this.id, ' ' + findlistnumber() + ". ", "", " List item");
});

function markdown_syntax(button_id, syntax_open, syntax_close = '', empty_msg) {
    var textarea = $('#' + textarea_id);

    var len = textarea.val().length;
    var start = textarea[0].selectionStart;
    var end = textarea[0].selectionEnd;
    var selectedText = textarea.val().substring(start, end);

    if (selectedText.length > 0) {

        if (button_id === 'code-button') {

            replacement = syntax_open + '\n' + selectedText + '\n' + syntax_close;  

        } else {

            replacement = syntax_open + selectedText + syntax_close;

        }

    } else {

        if (button_id === 'code-button') {

            replacement = syntax_open + '\n' + empty_msg + '\n' + syntax_close; 

        } else {

            replacement = syntax_open + empty_msg + syntax_close;

        }

    }

    textarea.val(textarea.val().substring(0, start) + replacement + textarea.val().substring(end, len));

}

function findlistnumber(){
    var number = 1;

    var textarea = document.getElementById('message');

    var a = textarea.value;

    if(a.indexOf('1.') > -1){

        //Find lines with links

        var matches = a.match(/(^|\n)\s*\d+./g);

        //Find corresponding numbers

        var usedNumbers = matches.map(function(match){
            return parseInt(match.match(/\d+/)[0]); }
        );

        //Find first unused number

        var number = 1;

        while(true){

            if(usedNumbers.indexOf(number) === -1){

                //Found unused number

                 return number;
            }

            number++;
        }
    }

    return number;
}

});

HTML

<div class="container">

<div class="row lg-space">
<div class="col-lg-12">
<button type="button" id="olist-button" class="btn btn-default"><i class="fa fa-list-ol" aria-hidden="true"></i></button>
</div>
</div>

<div class="row lg-space">
<div class="col-lg-12">  
<div class="form-group">  
<textarea id="message" rows="10" class="form-control" name="message"></textarea>
</div>  
</div>
</div>


</div>

示例编辑器在我的本地主机上的样子

从1开始创建新的有序列表编号组

0 个答案: