CODEWITHSUNDEEP
javascripthtmlkeyboard-events
Kelly Cline
Kelly Cline

Reputation: 2246

StopPropagation of keyboard events

I have this little bit of HTML

<input id="legalWellName" readonly data-bind="value: LEGAL_WELL_NAME" class="welllabel" />

and this script:

$('#legalWellName').keyup(function (e) {
    if (e.stopPropagation) { e.stopPropagation(); }
    if (e.cancelBubble != null) { e.cancelBubble = true; }
});
$('#legalWellName').keydown(function (e) {
    if (e.stopPropagation) { e.stopPropagation(); }
    if (e.cancelBubble != null) { e.cancelBubble = true; }
});
$('#legalWellName').keypress(function (e) {
    if (e.stopPropagation) { e.stopPropagation(); }
    if (e.cancelBubble != null) { e.cancelBubble = true; }
});

However, if I click into the legalWellName input and hit BACKSPACE, it acts as if I have hit BACK in the Browser (IE9). Is there something special about BACKSPACE? I have already set readonly, so no other keys have any effect (I didn't even need the stopPropagation logic). How can I prevent the BACKSPACE from taking effect?

Upvotes: 1

Views: 2195

Answers (1)

Teemu
Teemu

Reputation: 23406

Prevent bubbling only prevents event to bubble from element to another in the DOM. Looks like you'd rather like to prevent default action of Backspace:

if (e.preventDefault) {
    e.preventDefault();
}
e.returnValue = false;

Notice, that you can safely add a property to e without feature detection.

Upvotes: 3

Related Questions