Как я могу автоматически расширять свою текстовую область, когда я пишу?
Это мой код:
<script type="text/javascript"> function clearContents(element) { element.value = ''; } function updateContents(element) { element.value = "What's on your mind?"; } </script> <h1>New status</h1> <form action="index.php" method="post" name="new_message"> <textarea id="message" onFocus="clearContents(this);" onKeyPress="catchEnter(this);">What's on your mind?</textarea> <input type="button" value="Post"> </form>
Я использовал эластичное текстовое поле от Unwrongest , и это фантастический плагин.
Просто включите плагин, а затем вызовите плагин просто так:
$('#TextAreaId').elastic();
вот и все.
Ознакомьтесь с демонстрацией здесь: http://jsfiddle.net/janjarfalk/r3Ekw/
шаг 1 : добавьте это к вашему <head> в своем html:
<head>
http://jquery-elastic.googlecode.com/svn/trunk/jquery.elastic.source.js
шаг 2 : добавьте это к своему html-файлу, прямо перед тегом </body>:
</body>
$('textarea').elastic();
шаг 3 : используйте этот шаг ТОЛЬКО, если он не работает после шага 2. Добавьте следующую строку над кодом из шага 1:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
Высделанный.Если у вас уже есть jQuery, пропустите шаг 3.
<textarea onkeyup="textarea(this);"></textarea> <script> function textarea(box){ box.style.height = box.scrollHeight+'px'; } </script>
Тогда БАМ !!! у вас растущая текстовая область. Возможно, вам придется учитывать границы и отступы. включите их в функцию.