question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How to exit blockquote block or div

See original GitHub issue

Steps to reproduce:

  1. Clicking blockquote icon
  2. Insert the content
  3. No way to move the cursor to go out of <blockquote></blockquote>

it’s the same issue if I change <blockquote></blockquote> to <div></div>

But for <table></table> or <a></a>, I can use left arrow or right arrow to exit the table block please try: https://codepen.io/hoangnt142/pen/GGKBMw many thanks!!

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:2
  • Comments:7 (1 by maintainers)

github_iconTop GitHub Comments

6reactions
nguyenkiiducommented, May 31, 2018

I resolved this problem by using this config we need to press ESC button to exit

init_instance_callback: function (editor) {
  editor.on('KeyDown', function (e) {
    if(e.keyCode == 27) {
      let editor = tinyMCE.activeEditor
      const dom = editor.dom
      const parentBlock = tinyMCE.activeEditor.selection.getSelectedBlocks()[0]
      const containerBlock = parentBlock.parentNode.nodeName == 'BODY' ? dom.getParent(parentBlock, dom.isBlock) : dom.getParent(parentBlock.parentNode, dom.isBlock)
      let newBlock = tinyMCE.activeEditor.dom.create('p')
      newBlock.innerHTML = '<br data-mce-bogus="1">';
      dom.insertAfter(newBlock, containerBlock)
      let rng = dom.createRng();
      newBlock.normalize();
      rng.setStart(newBlock, 0);
      rng.setEnd(newBlock, 0);
      editor.selection.setRng(rng);
    }
  });
},
1reaction
hlthicommented, Jun 1, 2018

Same problem, nguyenkiidu’s config work like a charm.

Read more comments on GitHub >

github_iconTop Results From Across the Web

HTML blockquote vs div - css - Stack Overflow
As mentioned, <blockquote> is for quoting. Similarly you will use several <p> blocks for paragraphs within one <div> that holds page content or...
Read more >
<blockquote>: The Block Quotation element - MDN Web Docs
To change the indentation applied to the quoted text, use the CSS margin-left and/or margin-right properties, or the margin shorthand property.
Read more >
Quoting in HTML: Quotations, Citations, and Blockquotes
As a flow element (i.e. “block level” element), blockquote can contain other elements ... then perhaps a div with a class is the...
Read more >
HTML blockquote tag - W3Schools
Definition and Usage. The <blockquote> tag specifies a section that is quoted from another source. Browsers usually indent <blockquote> elements (look at ...
Read more >
Headings, Block Elements and Blockquotes - JCE Editor
The list contains the block elements Paragraph, DIV, Address, ... Although not listed in the Format List, Blockquote is a block element and...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found