Joel
Joel

Reputation: 348

Tab delimiter not working in Chrome textarea - Javascript

I have a textarea, that I would like to add a tab "\t" to when the user presses the tab key. My current code is:

textarea.onkeydown = function (e) {
  var key = (e.keyCode || e.which);
  if (key == 9) {
    (e.preventDefault ? e.preventDefault() : e.stopPropogation());
    var s = this.selectionStart;
    var end = this.selectionEnd;
    this.value = this.value.substring(0, s) + "\t" + this.value.substring(end);
    this.selectionStart = end + 1;
  }
};

It works fine in Firefox, in IE the text moves around while the tab key is held in, but it adds a tab, however in Chrome nothing happens. I looked at the value property in developer tools, and I see the tabs, but they aren't displayed in the textarea, I can't select the or move the cursor over to them.

Upvotes: 0

Views: 461

Answers (1)

Vasiliy vvscode Vanchuk
Vasiliy vvscode Vanchuk

Reputation: 7169

In your code - remove

> white-space: nowrap;

for textarea

http://jsbin.com/tacagavawuwa/9/

nowrap Sequences of whitespace will collapse into a single whitespace. Text will never wrap to the next line. The text continues on the same line until a
tag is encountered http://www.w3schools.com/cssref/pr_text_white-space.asp

Upvotes: 0

Related Questions