You are here: Reference > JavaScript > client-side > HTML DOM > properties > wrap (textarea)

wrap property (textarea)

Browser support:
Specifies or returns the word wrapping behavior.
To manipulate word wrapping rules in other elements see the links of the related section below.

Syntax:

object.wrap;
You can find the related objects in the Supported by objects section below.
This property is read/write.
HTML page for this property: wrap

Possible values:

String that sets or retrieves the type of word wrapping.
One of the following values:
hard
Word wrapping is enabled and the submitted text (if the textarea element is in a form element) will contain the inserted line break characters, too.
off
Word wrapping is disabled.
soft
Default. Word wrapping is enabled but the submitted text (if the textarea element is in a form element) will not contain the inserted line break characters.
Default: soft.

Example HTML code 1:

This example illustrates the use of the wrap attribute:
<textarea rows="10" cols="10" wrap="off" style="width:300px">
    The wrap flag is off for this field therefore this line may not be wrapped.
</textarea>
Did you find this example helpful? yes no

Example HTML code 2:

This example illustrates the use of the wrap property:
<head>
    <script type="text/javascript">
        function ChangeWrap (elem) {
            var textarea = document.getElementById ("wrapZone");
            
            // Returns the index of the selected option
            var whichSelected = elem.selectedIndex;

            // Returns the text of the selected option
            var wrapType = elem.options[whichSelected].text;

            if ('wrap' in textarea) {
                    // Internet Explorer
                textarea.wrap = wrapType;
            }
            else {
                textarea.setAttribute ("wrap", wrapType);
            }

            // To solve refresh problems in Firefox, Google Chrome, Safari and Opera
            var nextElem = textarea.nextSibling;
            var paren = textarea.parentNode;
            paren.removeChild (textarea);
            paren.insertBefore (textarea, nextElem);
        }
    </script>
</head>
<body>
    <textarea id="wrapZone" rows="10" wrap="hard" style="width:300px">
        You can change the wrap flag of this field in the selection list below.
    </textarea>

    <select onchange="ChangeWrap (this);" size="3">
        <option />hard
        <option />off
        <option selected="selected" />soft
    </select>
</body>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content