Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.07.2010, 02:26
Новичок на форуме
Отправить личное сообщение для watt Посмотреть профиль Найти все сообщения от watt
 
Регистрация: 08.01.2009
Сообщений: 4

динамическое textarea
Добрый вечер
имеется функция для изменения ширины textarea

function OnNeedResizeTextArea(id) {
var target = document.getElementById(id);
target.style.height = target.scrollHeight + "px";
}


Очень хотелось бы знать, существует ли способ отловить действия удаления текста и точно так же уменьшать высоту textarea.
Ответить с цитированием
  #2 (permalink)  
Старый 09.07.2010, 06:33
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

onchange
Ответить с цитированием
  #3 (permalink)  
Старый 09.07.2010, 06:43
Аватар для Hagrael
Аспирант
Отправить личное сообщение для Hagrael Посмотреть профиль Найти все сообщения от Hagrael
 
Регистрация: 17.02.2010
Сообщений: 88

Интересная задача ( но я её решить конечно не смогу((( ).
Ответить с цитированием
  #4 (permalink)  
Старый 09.07.2010, 06:50
Аватар для Hagrael
Аспирант
Отправить личное сообщение для Hagrael Посмотреть профиль Найти все сообщения от Hagrael
 
Регистрация: 17.02.2010
Сообщений: 88

exec,
насколько я знаю, onchange реагирует на изменение строчки, а ему надо на уменьшение символов. О! Есть идея, как отловить уменьшение.
Создаёшь функцию, происходящую после изменения textarea, в ней пишешь
"var text=document.getElementById(id) // Создаёшь объект - текстовое поле
var value=text.value // Создаёшь объект - его значение
if (value/text.rows>text.cols) {text.rows-=1}"
В итоге получится такой код:
function onch(id) {
var text=document.getElementById(id) // Создаёшь объект - текстовое поле
var value=text.innerHTML // Создаёшь объект - его значение
if (value/text.rows>text.cols) {text.rows-=1}
}

<textarea onChange="onch(this.id)" id="1(к примеру)"></textarea>

Вроде должно работать, но ничего не обещаю.

Последний раз редактировалось Hagrael, 09.07.2010 в 08:50.
Ответить с цитированием
  #5 (permalink)  
Старый 09.07.2010, 08:59
Аватар для Hagrael
Аспирант
Отправить личное сообщение для Hagrael Посмотреть профиль Найти все сообщения от Hagrael
 
Регистрация: 17.02.2010
Сообщений: 88

Хм... Я попробовал, и почему-то value=text.innerHTML не работает( Ведь у textarea текст заключён между открытием и закрытием! В чём дело?
Ответить с цитированием
  #6 (permalink)  
Старый 09.07.2010, 10:19
Профессор
Отправить личное сообщение для Sweet Посмотреть профиль Найти все сообщения от Sweet
 
Регистрация: 16.03.2010
Сообщений: 1,618

Hagrael, что-то вы какую-то ерунду творите Передавать функции id элемента, чтобы потом получить его через getElementById. Бред! "id="1(к примеру)" - плохой пример. Если вы не в курсе, id не может быть цифрой. Поэтому, наверное, и innerHTML не работает.
Сообщение от watt
имеется функция для изменения ширины textarea
, которая меняет высоту. Не странно ли?
А по теме:
<textarea onKeydown="this.style.height = this.scrollHeight + 'px';"></textarea>
Ответить с цитированием
  #7 (permalink)  
Старый 12.07.2010, 15:41
Новичок на форуме
Отправить личное сообщение для watt Посмотреть профиль Найти все сообщения от watt
 
Регистрация: 08.01.2009
Сообщений: 4

Нашёл прототип к jquery, но подключать только ради этого саму библиотеку не хочется.


(function($) {
$.fn.autogrow = function(options) {
        
this.filter('textarea').each(function() {
var $this       = $(this),
minHeight   = $this.height(),
lineHeight  = $this.css('lineHeight');
            
var shadow = $('<div></div>').css({
position:   'absolute',
top:        -10000,
left:       -10000,
width:      $(this).width() - parseInt($this.css('paddingLeft')) - parseInt($this.css('paddingRight')),
fontSize:   $this.css('fontSize'),
fontFamily: $this.css('fontFamily'),
lineHeight: $this.css('lineHeight'),
resize:     'none'
}).appendTo(document.body);
            
var update = function() {
var times = function(string, number) { for (var i = 0, r = ''; i < number; i ++) r += string; return r; };
var val = this.value.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/&/g, '&amp;')
.replace(/\n$/, '<br/>&nbsp;')
.replace(/\n/g, '<br/>')
.replace(/ {2,}/g, 
function(space) { return times('&nbsp;', space.length -1) + ' ' });
shadow.html(val);
$(this).css('height', Math.max(shadow.height() + 20, minHeight)); }

$(this).change(update).keyup(update).keydown(update);
update.apply(this); });
return this; } })(jQuery);


<textarea rows='6' style='line-height:1; font-size: 120%; width: 100%'></textarea>

кто знаком с jq подскажите, как заменить функции jq обычными dom?
на ум приходит что-то вроде этого:

var shadow = $('<div></div>').css({
position:   'absolute'...


-

var element = Document.createElement('div')
element.position:   'absolute'...

Последний раз редактировалось watt, 12.07.2010 в 15:44.
Ответить с цитированием
  #8 (permalink)  
Старый 12.07.2010, 15:56
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

Цитата:
как
Платно.
Ответить с цитированием
  #9 (permalink)  
Старый 13.07.2010, 03:50
Новичок на форуме
Отправить личное сообщение для watt Посмотреть профиль Найти все сообщения от watt
 
Регистрация: 08.01.2009
Сообщений: 4

Вдруг кто-нибудь столкнётся с аналогичной проблемой:
resize_textarea = function(е) {
  var t = document.getElementById(е);
  var d = document.getElementById(t.id+'_tmp');
  if (!d) {
    d = document.createElement('div');
    document.body.appendChild(d);
    d.id = t.id + '_tmp';
    d.setAttribute('style',
       'font-family: monospace;'
     + 'font-size: 17px;'
     + 'width: ' + (t.scrollWidth-20) + 'px;'
     + 'visibility: hidden;'
     + 'position: absolute;'
     + 'top: 0;');
  }
  d.innerHTML = t.value.replace(/\n/g,'<br/>');
  t.style.height = (d.offsetHeight+20) + 'px';
}


спасибо всем, кто принимал участие.


«— Почему у exec'a большой нос? — Потому что воздух бесплатный.» ;-)

Последний раз редактировалось watt, 13.07.2010 в 03:55.
Ответить с цитированием
  #10 (permalink)  
Старый 13.07.2010, 06:23
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

Цитата:
Почему у exec'a большой нос? — Потому что воздух бесплатный.
Свою петросянщину оставь при себе.
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Динамическое удаление строк таблицы Tankist Events/DOM/Window 16 03.07.2013 16:42
Подсчет "реальной" длины текста в textarea modernx Элементы интерфейса 22 06.06.2010 18:30
Подставление переменной в textarea BorisBritva Events/DOM/Window 10 21.04.2010 12:54
Помогите плз с textarea Neskuick Общие вопросы Javascript 1 19.02.2010 23:25
textarea validation Петр Общие вопросы Javascript 3 08.12.2009 18:59