Оглавление

18.7. Поле для ввода многострочного текста.

Добавление слов из текстового поля в поле <textarea>

 

Поле   для   ввода   многострочного   текста,   определяемое   парным   тегом <textarea>, поддерживает те же свойства, методы и события, что и простое поле ввода (см. разд. 16.6), за исключением свойства maxLength. Кроме того, поддерживается еще одно свойство:
□  wrap — режим переноса слов. Может принимать следующие значения:
         •    off — не переносить слова;
         •    physical — слова переносятся как на экране, так и при передаче данных серверу;
         •    virtual — слова переносятся только на экране, но не при передаче данных серверу.

 

Для примера рассмотрим возможность добавления слов из текстового поля в поле для ввода многострочного текста (листинг 68). Добавить слово можно с помощью кнопки Добавить слово или с помощью клавиши <Enter>. Так как по умолчанию нажатие клавиши <Enter> приводит к отправке данных формы, то всплывание события прерывается с помощью присвоения значения false свойству retumVaiue объекта event. При нажатии кнопки Значение поля выводится текущее значение тега <textarea>.

 

Листинг 68. Добавление слов из текстового поля в поле <textarea>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
         "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
 <title>Пример использования поля &lt;TEXTAREA&gt;</title>
 <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<script type="text/javascript">
<!--
function f_submit() {
   var value1 = document.getElementById("pole1").value;
   window.alert("Текущее значение: \n" + value1);
   return false;
}
function f_click() {
   var pole2 = document.getElementById("pole2");
   var text1 = pole2.value;
   if (text1 != "") {
      document.getElementById("pole1").value += text1 + "\n";
      pole2.value = "";
      pole2.focus();
   }
   else {
      window.alert("Поле не заполнено!");
      pole2.focus();
   }
}
function f_press(e) {
   e = e || window.event;
   if (e.keyCode==13) {
      f_click();
      if (e.preventDefault) e.preventDefault();
      else e.returnValue = false;
   }
}
//-->
</script>
</head>
<body>
 <form action="test.php" method="GET" name="frm" id="frm"
  onsubmit="return f_submit();">
 <div>
  Слово:<br>
  <input type="text" name="pole2" id="pole2" 
   onkeypress="f_press(event);"><br>
  <textarea name="pole1" id="pole1" cols="15" rows="10"></textarea>
  <br><input type="button" value="Добавить слово" 
   onclick="return f_click();"><br>
  <input type="submit" value=" Значение поля ">
 </div>
 </form>
</body>
</html>

 

<< Меню >>  
Комментарии принадлежат их авторам. Мы не несем ответственности за их содержание.
Отправитель Нити