StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>According to <a href="http://www.w3.org/TR/html4/interact/forms.html#edef-TEXTAREA" rel="nofollow noreferrer">the HTML 4.01 spec</a>, <code>wrap</code> isn't a valid attribute for <code><textarea></code>s which would explain why it's so difficult and strange. It looks as though Firefox actually does use the <code>wrap</code> attribute, but it won't let you change it.</p> <p>I do have a solution though! It's pretty awful, but here it is. Completely replace the textarea with a new one.</p> <pre><code>// this is the onclick handler for your button document.getElementById("nowrapButton").onclick = function() { var oldOne = this.form.content; // the old textarea var newOne = document.createElement('textarea'); // the new textarea var attrs = ['name', 'rows', 'cols']; // these are the attributes to keep for (var i = 0; i < attrs.length; ++i) { // copy the attributes to the new one newOne.setAttribute(attrs[i], oldOne.getAttribute(attrs[i])); } // toggle the wrapping on and off if (oldOne.getAttribute('wrap') != 'off') { newOne.setAttribute('wrap', 'off'); } // copy the text over newOne.value = oldOne.value; // add the new one oldOne.parentNode.insertBefore(newOne, oldOne); // get rid of the old one oldOne.parentNode.removeChild(oldOne); return false; }; </code></pre> <p>Here's a working version of this you can play with: <a href="http://jsbin.com/ugepa" rel="nofollow noreferrer">http://jsbin.com/ugepa</a></p> <p>As usual, this'd be much nicer in jQuery. :)</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload