Удалите последние 2 символа, если они /c, и установите фокус в конце текста в wysihtml5 jquery

Я использую редактор wysihtml5, где пользователи могут добавить стандартный ответ 2 разными способами. Либо они могут выбрать из выпадающего списка select2 вручную, либо они могут набрать /c в текстовой области, и это вызовет раскрывающийся список, а затем они могут просто ввести желаемый ответ и нажать ввод, а затем он вводит его в текстовую область.

Если пользователь выбирает раскрывающийся список вручную, то нет /c чтобы справиться с этим, его не нужно удалять из текстовой области, поскольку он не был напечатан, но если пользователь вводит /c чтобы вызвать раскрывающийся список, то после того, как код вставляет постоянный ответ в текстовую область, то /c остается в текстовой области, которая должна быть удалена.

Я надеюсь, что все это имеет смысл...

У меня все работает на данный момент, но я застрял на

а) Удаление предыдущего /c если пользователь набрал его и...

б) размещение фокуса в конце текстовой области после ее вставки.

JQuery

Это для выпадающего списка select2

$('#cannedreplies').on('change', function() {
    // get the id of canned reply from value of option
    var canned_id = $(this).val();
    $.ajax({
        type: 'post',
        url: 'get_canned_reply.php',
        data: {canned_id: canned_id},
        success: function (data) {
            // append the canned reply to the wysihtml5
            $('.wysihtml5-sandbox').contents().find('.wysihtml5-editor').focus().append(data);
            // set value to null to reset the dropdown
            $('#cannedreplies').val(null);
            // set focus so cursor goes to search field of select2
            $('.select2-search__field').focus();
        }
    })
})

Это для обнаружения нажатия клавиш для /c

var keys = [];
var input = [];
var findString = '/c';
$('.wysihtml5-sandbox').contents().find('body').on('keypress',function(e) {
    keys.unshift(e.keyCode || e.which);
    updateN();
});
function updateN() {
    //push into the input array
    input.push(String.fromCharCode(parseInt(keys[0])));
    //check if input is of valid length to be searched for string 
    if (input.length >= findString.length) {
        //if last 2 keys match the string to be found 
        var keyFound = (input[input.length - 2] + input[input.length - 1]) == findString;
        //if string found
        if (keyFound) {
            // found the /c do something
            var select21 = $('#cannedreplies').data('select2');
            setTimeout(
                function() {
                    select21.open();
                },
            200);
        }
        if (input.length > 20) {
            //reset the array but keep last 2 indexes to keep the track of the pressed keys
            input.splice(0, input.length - 2);
        }
    }
}

HTML

Приведенный выше код jquery использует ajax/php для получения стандартных ответов, но для простоты здесь я показываю жестко закодированную версию html.

<select id="cannedreplies">
    <option value="">Pick canned reply</option>
    <option value="1">This</option>
    <option value="2">That</option>
</select>

<div class="wysihtml5-sandbox">
    <div class="wysihtml5-editor"></div>
</div>

0 ответов

Другие вопросы по тегам