Textarea

Объект Textarea представляет собой HTML элемент <textarea>.

Свойства и Методы объекта Textarea

autofocus

Свойство autofocus отражает атрибут autofocus.

Синтаксис

textareaObject.autofocus [ = true|false ]

• true - текстовая область автоматически получает фокус при загрузке страницы;
• false - текстовая область НЕ получает фокус при загрузке страницы.

Возвращаемое значение

Логический, возвращает true, если текстовая область автоматически получает фокус при загрузке страницы, в противном случае - false.

Совместимость с браузерами

Да	10,0	Да	Да	12,0+

Пример

<p>Адрес:</p>
<textarea id="myTextarea" autofocus  rows='2' cols='30'>
 Улица Пролетная, 25,
 Усть-Кыбырзы
</textarea>

<button onclick="myFunction()"> Попробуй </button>

<p id="demo"></p>

<script>
function myFunction() {
    var x = document.getElementById("myTextarea").autofocus;
    document.getElementById("demo").innerHTML = x;
}
</script>

cols

Свойство cols устанавливает или возвращает значение атрибута cols текстовой области.

Синтаксис

textareaObject.cols [ = number ]

number - Определяет ширину (в символах) текстовой области. Значение по умолчанию 20

Возвращаемое значение

Целое число, представляющее ширину (в символах) текстовой области

Пример

<textarea name='Rusia' rows='4' cols='60' readonly='readonly' id="t"  wrap="off">
Россия — страна, расположенная в Восточной Европе и Северной Азии. 
Является самым большим государством мира (17 075 400 км2 или 11,46 % площади всей суши Земли, или 
12,65 % заселённой человеком суши, что почти вдвое больше, чем у занимающей второе место Канады). 
Население на 2010 год составляет 142 856 536 человек.

Текст взят с wikipedia.org.
</textarea><br>
<button type="button" onclick="myFunction()">  Попробуй </button>
<p id="demo"></p>
<script>
function myFunction() {
  var t = document.getElementById("t");
  t.cols = 100; t.rows = 7; t.wrap="soft"
  document.getElementById("demo").innerHTML = 
   "<br>Name = " + t.name +
   "<br>wrap = " + t.wrap +
   "<br>cols = " + t.cols +
   "<br>rows = " + t.rows +
   "<br>readOnly = " + t.readOnly;
}
</script>

defaultValue

Свойство defaultValue возвращает или устанавливает текст по умолчанию.

Значение по умолчанию для текстовой области - текст между <textarea> и </textarea> тэгов.

Синтаксис

textareaObject.defaultValue [ = str_defaultValue ]

str_defaultValue - Задает значение по умолчанию текстовой области.

Возвращаемое значение

Строка, представляющая значение по умолчанию текстовой области

Пример

<p>Адрес:</p>
<textarea id="myTextarea"   rows='2' cols='30'>
 Улица Пролетная, 25,
 Усть-Кыбырзы
</textarea>

<button onclick="myFunction()"> Попробуй </button>

<script>
function myFunction() {
    var x = document.getElementById("myTextarea")
    x.defaultValue = "Красная площадь,\nМосква";
}
</script>

disabled

Свойство disabled отражает одноименный атрибут disabled.

Синтаксис

textareaObject.disabled [ = true|false ]

• true - Текстовая область заблокирована;
• false - По умолчанию. Область текста не заблокирована.

Возвращаемое значение

Логическое, возвращает true, если область текста заблокирована, в противном случае - false.

Пример

<p>Адрес:</p>
<textarea id="myTextarea"   rows='2' cols='30'>
 Улица Пролетная, 25,
 Усть-Кыбырзы
</textarea>

<button onclick="myFunction()"> Попробуй </button>

<script>
function myFunction() 
 {  var x = document.getElementById("myTextarea")
    x.disabled = true; }
</script>

form

Свойство form возвращает ссылку на элемент form, который содержит текстовую область.

Синтаксис

textareaObject.form

Возвращаемое значение

Ссылка на элемент form, содержащий текстовую область, или null.

Пример

<form id="myForm">
<p>Адрес:</p>
<textarea id="myTextarea"   rows='2' cols='30'>
 Улица Пролетная, 25,
 Усть-Кыбырзы
</textarea>
</form>
<button onclick="myFunction()"> Попробуй </button>
<p id="demo"></p>
<script>
function myFunction() 
 { document.getElementById("demo").innerHTML = 
      document.getElementById("myTextarea").form.id; }
</script>

maxLength

Свойство maxLength устанавливает или возвращает значение атрибута maxlength, который определяет максимальное количество символов в текстовой области.

Синтаксис

textareaObject.maxLength [ = number ]

number - задает максимальное количество символов в текстовой области.

Возвращаемое значение

Число, представляющее максимальное допустимое количество символов в текстовой области.

Совместимость с браузерами

Да	10,0	Да	Да	12,0+

Пример

<p>Адрес:</p>
<textarea id="myTextarea"   rows='2' cols='30'>
 Улица Пролетная, 25,
 Усть-Кыбырзы
</textarea>

<button onclick="myFunction()"> Попробуй </button>
<p id="demo"></p>
<script>
function myFunction() 
 { document.getElementById("demo").innerHTML = 
      document.getElementById("myTextarea").maxLength; }
</script>

name

Свойство name возвращает или устанавливает значение атрибута name

Синтаксис

textareaObject.name [ = str_name ]

str_name задает имя текстовой области.

Возвращаемое значение

Строка, представляющая имя текстовой области

Пример

placeholder

Свойство placeholder устанавливает или возвращает значение атрибута placeholder, который указывает краткую подсказку, описывающую ожидаемое значение текстовой области. Подсказка отображается в текстовой области, когда он пуст, и исчезает, когда поле получает фокус.

Синтаксис

textareaObject.placeholder [ = text ]

text задает краткую подсказку, которая описывает ожидаемое значение текстовой области

Возвращаемое значение

Строка, представляющая краткую подсказку, которая описывает ожидаемое значение текстовой области

Совместимость с браузерами

Да	10,0	Да	Да	Да

Пример

<textarea id="myTextarea"   rows='4' cols='40' placeholder="Ваш адрес">
</textarea>

<button onclick="myFunction()"> Попробуй </button>

<p id="demo"></p>

<script>
function myFunction() 
 { document.getElementById("demo").innerHTML = 
      document.getElementById("myTextarea").placeholder; }
</script>

readOnly

Свойство readOnly отражает одноименный атрибут readonly.

Синтаксис

textareaObject.readOnly [ = true|false ]

• true - Текстовая область только для чтения;
• false - По умолчанию. Текстовая область изменчива.

Возвращаемое значение

Логическое, возвращает true, если текстовая область только для чтения, в противном случае - false.

Пример

<p>Адрес:</p>
<textarea id="myTextarea"   rows='3' cols='30'>
 Улица Пролетная, 25,
 Усть-Кыбырзы
</textarea>

<button onclick="myFunction()"> Попробуй </button>

<script>
function myFunction() 
 { document.getElementById("myTextarea").readOnly = true; }
</script>

required

Свойство required устанавливает или возвращает значение атрибута required.

Синтаксис

textareaObject.required [ = true|false ]

• true - Текстовая область является обязательной для заполнения перед отправкой формы на сервер;
• false - По умолчанию. Область текста не является обязательной для заполнения перед отправкой формы на сервер.

Возвращаемое значение

Логический, возвращает true, если текстовая область является обязательной для заполнения перед отправкой формы на сервер, в противном случае - false

Совместимость с браузерами

Да	10,0	Да	Нет	Да

rows

Свойство rows устанавливает или возвращает значение атрибута rows текстовой области.

Синтаксис

textareaObject.rows [ = number ]

number - Определяет видимое количество строк в текстовой области. Значение по умолчанию 2

Возвращаемое значение

Целое число, представляющее высоту текстовой области.

Пример

select()

Метод select выбирает все содержимое текстовой области.

Синтаксис

textareaObject.select()

Пример

<p>Адрес:</p>
<textarea id="myTextarea"   rows='3' cols='30'>
 Улица Пролетная, 25,
 Усть-Кыбырзы
</textarea>

<button onclick="myFunction()"> Попробуй </button>

<script>
function myFunction() 
 { document.getElementById("myTextarea").select(); }
</script>

value

Свойство value устанавливает или возвращает содержимое текстовой области.

Синтаксис

textareaObject.value [ = str_value ]

Пример

<p>Адрес:</p>
<textarea id="myTextarea"   rows='2' cols='30'>
 Улица Пролетная, 25,
 Усть-Кыбырзы
</textarea>

<button onclick="myFunction()"> Попробуй </button>

<script>
function myFunction() {
    var x = document.getElementById("myTextarea")
    x.value = "Красная площадь,\nМосква";
}
</script>

wrap

Свойство wrap устанавливает или возвращает значение атрибута wrap.

Синтаксис

textareaObject.wrap [ = soft|hard|off ]

soft

По умолчанию. Длинный текст, который самостоятельно не помещается в поле по ширине, будет автоматически перенесен на новую строку, однако передаваться на сервер будет как одна строка. Нажатие клавиши Enter устанавливает перенос текста, который сохраняется при отправке формы.

hard

Слова в поле переносятся механически, чтобы они поместились в размер области, и при отправке на сервер места автоматического переноса сохраняются. При этом значении обязательно должен присутствовать атрибут cols.

off

Нестандартное значение. Переносы строк отключены. При введении длинного текста без переносов, он будет печататься в одну строку, при этом будет отображаться полоса прокрутки.

Возвращаемое значение

Строка, представляющая как осуществлять перенос текста в поле <textarea> и в каком виде отправлять данные на сервер.

Пример