CODEWITHSUNDEEP
javascript
user2826169
user2826169

Reputation: 285

How to prevent the cursor to go back while pressing backspace key in javascript?

Please consider the following html.

<div id="container" contenteditable="true">
<p>This is a paragraph <span class="test">'this text is inside the span'</span> 
        This is another paragraph afer the span tag inside this p tag
    </p> </div>

As you see, the p and the span tag are editable in the browser.It means we can write in it in browser. Now my question is about the span inside the p tag. So can anyone explain If the cursor (while typing in this span in browser) is just after the span tag i.e after the closing span tag,the backspace key should not work.

More simple,once the cursor goes outside the span,the backspace key should not move it again to go to the span. Please help with a simple example in javascript.

Upvotes: 1

Views: 342

Answers (1)

avrahamcool
avrahamcool

Reputation: 14094

If you can change your DOM a little bit, you can do this without Javascript.

See that Fiddle

<div id="container">
    <span  contenteditable="true">This is a paragraph</span>
    <span class="test" contenteditable="true">'this text is inside the span'</span>
    <span contenteditable="true">This is another paragraph afer the span tag inside this tag</span>
</div>

the CSS is only to show the different span's

.test
{
    background-color: red;
}

Upvotes: 0

Related Questions