Как пропускать элемент формы если он ридонли?

[Great Rash]

Здравствуйте.

Возникла необходимость сделать такую штуку: есть форма, я шагаю по ее полям при помощи таба, нужно, чтобы фокус не устанавливался на поле если оно readonly, а сравился на следующее поле не readonly.

В принципе можно сделать поля формы disabled, чтобы они не получали фокус, когда тыкаешь таб. Но тогда данные из этих полей не будут отправляться на сервер.

Написал такой скрипт:

var getElem;

function checkTab(e) {
	var keycode;

	if (window.event) {
		keycode = window.event.keyCode;
	} else if (e) {
		keycode = e.which;
	}

	if (keycode == 9) {
		var form = document.getElementById('form');
		var num = 0;

		for (var k = 0; k < form.elements.length; k++) {
			if (getElem == form.elements[k]) {
				num = k;
			}
		}

		for (var i = num; i < form.elements.length; i++) {
			if (form.elements[i].readOnly == true) {
				if (i < (form.elements.length - 1)) {
					var elem = form.elements[i+1];

					form.elements[i].onfocus = function() {
						elem.focus();
						getElem = elem;
					}

					if (elem.readOnly == false) {
						break;
					}
				}
			}
		}
	}
}

window.onkeydown = function(e) {
	checkTab(e);
}

Загвоздка в том, что если в форме попадается <textarea>, то она получает фокус. В чем может быть дело? Может можно упростить мой скрипт? Или может я вообще не в ту степь полез?

[s0rr0w]

У тебя форму генерирует какой-то скрипт? Или руками?

[Great Rash]

Пока руками, но возможен и случай со скриптом.

[s0rr0w]

Пока руками, но возможен и случай со скриптом.

Про tabindex'ы слышали?

[Great Rash]

Нет не слышал. Где почитать?

UPD:

В общем погуглил, почитал... но так и не понял как это можно применить в моем случае. Ведь если форма будет формироваться скриптом, то я не узнаю сколько будет полей в ней. Хотя вот вычитал, что в яваскрипте есть такое свойство, но все равно не понимаю как проставление tabindex может помочь запретить фокусирование на определенном элементе.

Edited May 20, 2009 by Great Rash

[Styx]

Попробуйте еще так... =)

Javascript:

<script type="text/javascript">
   function checkReadOnly(e) {
	  var evnt = (e) ? e : ((window.event) ? window.event : null);
	  var _keyCode = evnt.charCode ? evnt.charCode : evnt.keyCode;
	  if (_keyCode != 9) {return true;}
	  var sender = (evnt.srcElement) ? evnt.srcElement : evnt.target;
	  var _form = document.getElementById("superForm");
	  if (!_form.elements[sender.name]) {return true;}

	  var nextFocused = _form.elements[_form.elements.length - 1];
	  for (var i = _form.elements.length - 1; i > -1; i--) {
		 if (_form.elements[i] == sender) {break;}
		 if (!_form.elements[i].readOnly) {
			nextFocused = _form.elements[i - 1];
		 }
	  }
	  nextFocused.focus();
   }
   window.onkeypress = function(e) {checkReadOnly(e);}
</script>

XHTML (например):

<form action="#" method="post" id="superForm">
   <input type="text" size="25" name="first" value="I'm not readonly..." /><br />
   <input type="text" size="25" name="second" value="I'm not readonly..." /><br />
   <input type="text" size="25" name="third" value="I'm readonly..." readonly="readonly" /><br />
   <input type="text" size="25" name="fourth" value="I'm not readonly..." /><br />
   <textarea rows="10" cols="35" name="fifth">I'm not readOnly...</textarea>
   <textarea rows="10" cols="35" name="sixth" readonly="readonly">I'm readOnly...</textarea><br />
   <input type="submit" value="submit" name="seventh" onclick="return false;" />
</form>

[s0rr0w]

Плохо вы читали.

<input type="text" tabindex="1">
<input type="text" tabindex="100">
<input type="text" tabindex="2">

Понажимайте таб и посмотрите траекторию движения.

[Great Rash]

2Styx:

Спасибо попробую.

UPD:

А для чего начинать название переменной с подчеркивания?

2s0rr0w:

Ну почему же, читал я хорошо. Можно даже сказать досконально. Только мне надо чтобы по табу фокус не передавался на ридонли вообще никогда. Т.е. если я дошел до последнего элемента формы, то возвращался бы на первый элемент формы, а не продолжал ходить по ссылкам и т.п. и т.д. (по чему там браузеры еще ходят...). В вашем же случае я рано или поздно перейду на элемент с табиндексом 100.

Хотя вот тут экспериментировал и выяснил, что если поставить элементу табиндекс равный -1, то по табу на него никогда не перейдешь. Но в мануале написано, что допустимыми значениями являются только положительные числа от 0 до 32 с чем-то тысяч. Так что не ясно как это отразится на недобраузерах... Да и не понятно как отразится на скорости работы скрипта проставления отрицательных табиндексов всем ненужным элементам на странице (пес его знает сколько их будет).

Edited May 21, 2009 by Great Rash

[Styx]

А для чего начинать название переменной с подчеркивания?

Это так... просто. Не люблю, когда имена пользовательских переменных совпадают с названиями объектов/атрибутов/методов и проч. (даже если переменные в локальной области видимости, и никаких конфликтов не может быть). Но придумывать оригинальное говорящее название переменным лень.