Блог

У меня есть кнопка, и при нажатии на нее я хочу добавить некоторый текст внутри редактора.

Я видел некоторые проблемы, в которых люди предлагали решение, и я попробовал его. Но когда я использую restoreRange и ExecCmd с insertHtml, он не вставляет курсор, только если что-то было введено в редакторе ранее, например, символ или пробел.

Другими словами, при нажатии на редактор он не вставляет туда, где был курсор, когда я нажимал, но при написании чего-либо это происходит.

Как если бы restoreRange работал только при написании чего-либо.

Проблема возникает со следующим кодом:

 $('#editor').trumbowyg({
  btnsDef: {
    testButton: {
      fn: function () {
        // Restore the previous position
        $("#editor").trumbowyg('restoreRange');
        // Add text in the current position 
        $("#editor").trumbowyg('execCmd',
        {
          cmd: 'insertHTML',
          param: 'Dummy text',
          forceCss: false
        });
      },
      title: 'test button',
      text: 'insert text',
      hasIcon: false
    }  
  },
  btns: [
    ['testButton'],
  ]
});
  

Воспроизвел проблему здесь:
https://jsfiddle.net/95nqv076 /

Я что-то упускаю?

Найдено решение: сохранить диапазон при размытии и при фокусировке.

 $('#editor').trumbowyg({
btnsDef: {
  testButton: {
    fn: function () {
      $("#editor").trumbowyg('restoreRange');
      $("#editor").trumbowyg('execCmd',
        {
      cmd: 'insertHTML',
          param: 'Dummy text',
          forceCss: false
        });
      },
      title: 'Button tooltip',
      text: 'Displayed button name',
      hasIcon: false
    }
  },
  btns: [
    ['testButton'],
  ]
}).on('tbwblur', function(){
  $("#editor").trumbowyg('saveRange');
}).on('tbwfocus', function(){
  $("#editor").trumbowyg('saveRange');
});
  

Надеюсь, это кому-то поможет!