admin管理员组

文章数量:1335861

I try to write an editor with contenteditable & execCommand Everything works fine on Firefox, but in chrome has an error with 'delete' mand.

Please view bellow photo:

This is my code:

var $obj = $('#myBlockDivId');
var selection = rangy.getSelection();
if (selection.rangeCount > 0) selection.removeAllRanges();
var range = rangy.createRange();
range.selectNode($obj[0]);
selection.addRange(range);
range.select();

when i console log: rangy.getSelection().toHtml() ==> it's right

but when i call:

document.execCommand("delete", null, false);

it's fine on Firefox but not right on Chrome, the wrapper div is not being deleted.

How can i fix this? I have to use execCommand because it's support undo and redo function. so, i can't use jquery or javascript dom selector to remove div.

(I bad at English, someone please edit my question for more clearly, many thanks)

I try to write an editor with contenteditable & execCommand Everything works fine on Firefox, but in chrome has an error with 'delete' mand.

Please view bellow photo:

This is my code:

var $obj = $('#myBlockDivId');
var selection = rangy.getSelection();
if (selection.rangeCount > 0) selection.removeAllRanges();
var range = rangy.createRange();
range.selectNode($obj[0]);
selection.addRange(range);
range.select();

when i console log: rangy.getSelection().toHtml() ==> it's right

but when i call:

document.execCommand("delete", null, false);

it's fine on Firefox but not right on Chrome, the wrapper div is not being deleted.

How can i fix this? I have to use execCommand because it's support undo and redo function. so, i can't use jquery or javascript dom selector to remove div.

(I bad at English, someone please edit my question for more clearly, many thanks)

Share Improve this question asked Oct 30, 2015 at 5:14 Anh TúAnh Tú 6367 silver badges21 bronze badges 3
  • 2 Can you post an example of the non-working code on jsFiddle? – BenjaminGolder Commented Nov 3, 2015 at 2:09
  • What is the error ? can you post it ? – Anonymous0day Commented Nov 6, 2015 at 8:47
  • Without an example of the code (especially the HTML), all of the answers will be guesses. Note that there is an answer using Stack Snippets. Please use the same, editing your question to include the HTML and JavaScript. – Heretic Monkey Commented Nov 9, 2015 at 19:49
Add a ment  | 

2 Answers 2

Reset to default 3 +25

Maybe you can try to do :
(note the argument alone)

<span contentEditable>
	Select something here and after click on delete.
</span>
<input type="button" value="Delete selection" onclick="document.execCommand('delete')"/>


Acording to w3c.github.io on Enabled mands :

At any given time, a supported mand can be either enabled or not. Authors can tell whether a mand is currently enabled using queryCommandEnabled(). Commands that are not enabled do nothing, as described in the definitions of the various methods that invoke mands.

Some helpfull links :

w3c Unofficial Draft 15 October 2015:

  • w3c execCommand
  • w3c Deleting the selection
  • w3C The delete mand

Other ressources :

  • List of contenteditable Browser Inconsistencies
  • quirksmode test page

Hope this will help you !

Try :

document.execCommand("delete", false, null);

Instead of :

document.execCommand("delete", null, false);

本文标签: javascript execCommand(39delete39) not delete all selection div in chromeStack Overflow