Приняв во внимание все пожелания и полезные сведения, попытаемся решить задачу

Автор: uzzy
Дата: 19.12.03

именно таким образом, чтобы в будущем можно было сказать смело: "У меня уже есть готовое решение". Заодно попробуем сделать решение максимально красивым... по возможности , конечно же. Судите сами насколько это удалось. Итак, внимание — реализация:

файлик needed_value_for_input_text.js

var dAll = document.all;
var texts = Array();
var cnt = 0;

// Обходим все элементы страницы и находим все текстовые поля
for (var i = 0; i < dAll.length; i++) {
    if( dAll[i].type == 'text') {
        texts[cnt++] = i;                       // Создаем массив уникальных идентификаторов текстовых полей
        dAll[i].uniqueId = i;                   // Определяем уникальный идентификатор у каждого поля
        if (dAll[i].neededValue == undefined) { // если аттрибут neededValue не задан, определяем его как пустую строку.
            dAll[i].neededValue = '';
        }
    }
}

document.focusedElement = null;               // Инициализация. Фокус не принадлежит ни одному полю...

// пишем обработчики событий OnFocus и OnBlur для всех текстовых полей
for (var i = 0; i < texts.length; i++) {
    
    // строим обработчики OnFocus
    dAll[texts[i]].onfocus = function() {
        // если фокус не находится ни в одном поле говорим, что фокус у данного поля :)
        if (document.focusedElement == null) {
            document.focusedElement = this.uniqueId;
        }
        // если фокус уже находится у другого поля - покидаем данное
        if (document.focusedElement != this.uniqueId) {
            this.blur();
        }
    }
    
    // Строим обработчики OnBlur
    dAll[texts[i]].onblur = function() {
        // если фокус уже находится у другого поля - покидаем данное
        if( document.focusedElement != this.uniqueId) {
            this.blur();
        } else {
            // иначе смотрим введено ли нужное значение в поле
            if (this.value == this.neededValue) {
                this.blur();                       // да введено, покидаем поле
                document.focusedElement = null;    // говорим, что фокуса ни у кого нет
            } else {
                this.focus();                      // иначе возвращаем фокус "на место"
            }
        }
    }
    
}

Теперь попробуем сделать выводы и принять решение, добились ли мы того чего желали, а именно, выясним — универсален ли наш код. При этом не имеется ввиду та универсальность, которая обеспечивает совместимость с браузерами от различных производителей. Нет, мы имеем ввиду универсальность несколько иного плана — сможем ли мы использовать повторно данный код в других задачах, где он может понадобиться. Для этого нужно осознать, что мы в итоге имеем. А имеем следующее...
Теперь для того, чтобы решить в будущем подобную задачу для IE 5+ (будем надеятся ), нам необходимо:

1. Включить в страницу следующий код
   

   <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="needed_value_for_input_text.js"></SCRIPT>

   
   
2. Определить аттрибуты neededValue у тэгов <Input type="text">, например:
   

   <INPUT TYPE="text" neededValue="blablabla">

Всё! Больше ничего не нужно — теперь те элементы input, которые имеют аттрибут neededValue будут держать у себя фокус до тех пор, пока не будет введено необходимое значение. А те элементы, для которых аттибут neededValue не определен... ну что же — они так и остануться обычными инпутами... но ведь это и правильно!

З.Ы. Ребятки, вы чувствуете всю мощь и красоту подобного подхода при написании ДХТМЛ? Да ведь я просто могу, блин, в штимеле написать, например:

<DIV special="editor"></div>

и вынести реализацию WYSIWYG редактора хрен знает куда, причем сделать их 200 штук на один ШТМЛ-шаблон!

Или просто писать таким образом различные компоненты, РАСШИРЯЮЩИЕ ФУНКЦИОНАЛЬНОСТЬ ШТМЛ, и в будущем свести большинство задач по клиентскому программированию к обычной HTML верстке ...

Вопрос — почему же до сих пор мы так не делали? Или кто-то уже так делал? Поделитесь опытом...

З.З.Ы. Специально хочу сказать спасибо uzzy за задачу, и marx paul за идею с аттрибутами.

все это конечно замечательно... но полученный HTML код не будет соответствовать стандарту W3C... сейчас браузеры это проглатывают... но что будет в будущем?...

Здравствуйте, anonymous, Вы писали:


A>все это конечно замечательно... но полученный HTML код не будет соответствовать стандарту W3C... сейчас браузеры это проглатывают... но что будет в будущем?...

Почему же это код не будет соответствовать стандарту? Мы пишем абсолютно стандартный код, а дополнительную функциональность добавляем САМИ! Т.о., мы просто расширяем стандарт "под себя" средствами, написаными нами самими. По стандарту "левые" аттрибуты просто игнорируются. А все остальное делаем мы... не вижу причин, чтобы не воспользоваться данными возможностями...

Здравствуйте, ЖуК, Вы писали:


ЖуК>З.Ы. Ребятки, вы чувствуете всю мощь и красоту подобного подхода при написании ДХТМЛ? Да ведь я просто могу, блин, в штимеле написать, например:
ЖуК>

ЖуК><DIV special="editor"></div>
ЖуК>

ЖуК>и вынести реализацию WYSIWYG редактора хрен знает куда, причем сделать их 200 штук на один ШТМЛ-шаблон!

Согласен, идея хорошая, но...
ЖуК>Или просто писать таким образом различные компоненты, РАСШИРЯЮЩИЕ ФУНКЦИОНАЛЬНОСТЬ ШТМЛ, и в будущем свести большинство задач по клиентскому программированию к обычной HTML верстке ...

ЖуК>Вопрос — почему же до сих пор мы так не делали? Или кто-то уже так делал? Поделитесь опытом...

...не нова — подумай: ведь это и есть собственно XML. Он идет еще дальше и говорит, нафига придерживаться стандартных тэгов, когда и их можно определять функционально и их свойства и рендеринг. И вообще не только для веба полезна разметка в брэкетах (i.e. SOAP)....

Собственно если глянуть в сторону веб сервисов, то объемы расщирения становятся просто необъятными!

Впрочем, вот тебе пара примеров от тов. Erik Arvidsson, как высоко может полететь программерская мысль, базируясь только на хтмл и явае скрипт:здесь, здесь и здесь].


А вообще, ты прав.

Иногда просто необходимо взглянуит на мир иначе
ЖуК>З.З.Ы. Специально хочу сказать спасибо uzzy за задачу, и marx paul за идею с аттрибутами.

Спасибо.

C ув.
Marx

Здравствуйте, anonymous, Вы писали:


A>все это конечно замечательно... но полученный HTML код не будет соответствовать стандарту W3C... сейчас браузеры это проглатывают... но что будет в будущем?...

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

Ставлю 50EUR

С ув.
Marx

Здравствуйте, marx paul, Вы писали:

MP>...не нова — подумай: ведь это и есть собственно XML. Он идет еще дальше и говорит, нафига придерживаться стандартных тэгов, когда и их можно определять функционально и их свойства и рендеринг. И вообще не только для веба полезна разметка в брэкетах (i.e. SOAP)....

Совершенно верно — в глобальном плане не нова. Дело немного не в этом. XML — это вообще чудная технология... НО! Сам по себе XML ничего не стоит, если его ничем не обрабатывать. В слечае веба, нам в любом случае придется XML трансформировать в HTML (который, собственно, и рендерит сам браузер) каким либо образом. Варианты есть — javascript, XSLT и т.д. Таким образом, я делаю вывод, что XML — крайне полезная вещь, когда речь идет о данных и их представлении. Это мощно! На этой основе можно строить города. Я же веду речь о повседневной нашей работе, которая так или иначе упирается в кодирование клиентских страничек (непосредственная работа с HTML+javascript). Так вот, я за свою недолгую работу веб-программистом уже всё-таки написал кучу всякой фигни . Я замечаю, что с каждым днём кодирование упирается в однотипные задачи (читай — такие, которые уже мной решались). Тем не менее в 90% случачаях я не могу просто взять и использовать уже написаный ранее кусок кода на 100%. Почему? Да потому, что я привык привязываться ко всяким document.getElementById('blablabla'), либо писать обработчики прямо в тэгах (кстати при трансформации XML->HTML с помощью XSLT ошибка может быть та же , мало того — не может быть, а есть). А что это значит? А это значит то, что, так или иначе, мне приходится править ранее написаный код, если я хочу ним воспользоваться (а вам нет?). Идея заключаестя в ином — в стиле программироания HTML (на мой взгляд, аналогия примерно такая: "структурное программирование — ООП"). Хлебом является, конечно же, способность языка гипертекстовой разметки к расширению. Солью — как это использовать . Теперь я уже окончательно пришел к выводу, каким образом я буду программировать HTML на JavaScript дальше. В скором времени большая часть рутин от меня уйдет. Демонстрирую еще один пример, который я немедленно для себя состряпал, дабы убедиться в лаконичности подобного подхода. Благодаря этому я, со временем, просто буду собирать страничку из "кирпичиков" — написанных мною ранее компонентов, решающих простейшие задачи. Вообщем, еще один пример:

Вот, непосредственно, HTML код задуманной мною странички (не забываем — это пример ):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
    <title>Validate Email Component Test</title>
    <script language="JavaScript" type="text/javascript" src="component.validate_email.js"></script>
</head>

<body>
<form>
Email 1: <input type="text" logicalType="email" value=""><br>
Email 2: <input type="text" logicalType="email" value=""><br>
<input type="submit">
</form>

</body>
</html>

А вот код моего компонента, как вы поняли, решающий задачу проверки синтаксиса e-mail адресов, которые пользователь вводит в поля формы.

component.validate_email.js:

window.onload = function() {
    var cnt = 0;
    for (var i = 0; i < document.forms.length; i++) {
        for (var j = 0; j < document.forms[i].elements.length; j++) {
            if ((document.forms[i].elements[j].type == "text") && (document.forms[i].elements[j].logicalType == "email")) {
                document.forms[i].onsubmit = _checkEmail;
                break;
            }
        }
    }
}

function _checkEmail() {
    var isAllDataValid = true;
    for (var i = 0; i < this.elements.length; i++) {
        var element = this.elements[i];
        if ((element.type == "text") && (element.logicalType == "email")) {
            var reg_exp = /^[a-z][\w\.]*@[\w\.]+\.[a-z]{2,4}/i;
            if( !reg_exp.test( element.value)) {
                alert( "Введен некорректный e-mail адрес!");
                element.focus();
                return false;
            }
        }
    }
    return true;
}

Дабы суть метода стала очевидна предлагаю вам опробовать данный код у себя, при этом "поиграйтесь" с HTML кодом — добавьте пару текстовых полей в форму, поставьте у некоторых из них атрибуты logicalType="email", уберите их у некоторых. Добавтье на страничку несколько подобных форм. Опробуйте. Опробуйте — и проникнитесь одной мыслью — это можно использовать ВЕЗДЕ! ВСЕГДА! В следующий раз, при решении задачи, когда на страничку нужно добавить текстовое поле, значение которого нужно проверять на соответствие синтаксису адреса электронной почты, — программирование сведется к вот этому:

<script language="JavaScript" type="text/javascript" src="component.validate_email.js"></script>
...
<input type="text" logicalType="email" value="">

И совершенно не имеет значения, сколько таких полей на страничке мне нужно — одно, два, ..., десять... Все будет работать.

З.Ы. Для меня — это выход, потому что это увеличит мою производительность, как программиста, в N раз


MP>Впрочем, вот тебе пара примеров от тов. Erik Arvidsson, как высоко может полететь программерская мысль, базируясь только на хтмл и явае скрипт:здесь, здесь и здесь].

Если ты меня решил удивлять интерфейсами, основанными на "полёте программерской мысли", то думаю, что тебе сюда.

Здравствуйте, ЖуК, Вы писали:

ЖуК>Здравствуйте, anonymous, Вы писали:


A>>все это конечно замечательно... но полученный HTML код не будет соответствовать стандарту W3C... сейчас браузеры это проглатывают... но что будет в будущем?...

ЖуК>Почему же это код не будет соответствовать стандарту?

потому что DTD у него будет другим... разве не так?...
в идеале нужно конечно же к писать расширение к DTD от W3C и вставлять его в документ... тогда код будет валидным...

Здравствуйте, marx paul, Вы писали:

MP>Здравствуйте, anonymous, Вы писали:


A>>все это конечно замечательно... но полученный HTML код не будет соответствовать стандарту W3C... сейчас браузеры это проглатывают... но что будет в будущем?...

MP>Достаточно почитать несколько рабочих групп W3C, чтобы понять, что браузеры в будующем будут проглатывать много много больше и позволять будут они намного более свободное программирование.

я был бы счастлив если бы все браузеры работали только по стандартам W3C... )

MP>Ставлю 50EUR

не принимаю... ) они сейчас что угодно позволяют...

Здравствуйте, ЖуК, Вы писали:



ЖуК>З.Ы. Для меня — это выход, потому что это увеличит мою производительность, как программиста, в N раз

Звучит убедительно!
Давай, чем спорить лучше откроем инициативу по созданию библиотек или классов, облегчающих работу веб-кодеров!
только давай лучще сразу делать на объектах (а не просто на куче функций), дабы сохранить reusability of the code.


ЖуК>Если ты меня решил удивлять интерфейсами, основанными на "полёте программерской мысли", то думаю, что тебе сюда.
таки это оно и есть, только правленное. в обшем-то дело не в интерфейсах, а в том, как реализована эта функциональность — я тащусь от кода .

ЗЫ: про инициативу я серьезно!

С ув.
Marx

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

Что это: Грубость и неблагодароность ламеров, которые боятся выразить свое спасибо оценочкой?

Влияние давно задуманной оценочной системы rsdn, которая поощряет юзеров, делающих посты, интересные "завсегдатаем" и только сейчас "заработавшей" по задумке и в этом форуме?

Или это просто новый трэнд?

Скорее всего это все вместе взятое, помноженное на кризис жанра

С ув.
Marx

Здравствуйте, marx paul, Вы писали:

MP>Здравствуйте, ЖуК, Вы писали:

ЖуК>>З.Ы. Для меня — это выход, потому что это увеличит мою производительность, как программиста, в N раз

MP>Звучит убедительно!
MP>Давай, чем спорить лучше откроем инициативу по созданию библиотек или классов, облегчающих работу веб-кодеров!

Я уже и сам об этом подумал... В принципе я готов поддержать идею и у меня даже есть "место", где это можно реализовываать (смотри правый верхний угол ).

MP>только давай лучще сразу делать на объектах (а не просто на куче функций), дабы сохранить reusability of the code.

Согласен. Объекты — это гуд.

MP>ЗЫ: про инициативу я серьезно!

Я тоже

Здравствуйте, marx paul, Вы писали:

MP>Стал замечать, что в форуме намного лучше оценваются посты вовсе не с помощью для ламеров, а скорее, посты на отвлеченные темы. типа: решить головоломку или рассказать всему миру о прелестях той или иной "свеженайденной" фитчи

MP>Что это: Грубость и неблагодароность ламеров, которые боятся выразить свое спасибо оценочкой?

Читаем "Правила начисления оценок":

Система оценок сайта RSDN.ru предназначена для выделения из общей массы наиболее интересных и неординарных сообщений, повышения качества дискуссий и учёта общественного мнения при формировании списка Q&A для сайта, рассылки и нашего журнала на основе материалов форума. В этом начинании мы полагаемся прежде всего на вас. Давая оценки, вы помогаете нам выбирать наиболее интересные темы и обращаете на них внимание ваших коллег.

По-моему, все происходит именно так, как и предполагалось

Здравствуйте, marx paul, Вы писали:

MP>Стал замечать, что в форуме намного лучше оценваются посты вовсе не с помощью для ламеров, а скорее, посты на отвлеченные темы. типа: решить головоломку или рассказать всему миру о прелестях той или иной "свеженайденной" фитчи

MP>Что это: Грубость и неблагодароность ламеров, которые боятся выразить свое спасибо оценочкой?

MP>Влияние давно задуманной оценочной системы rsdn, которая поощряет юзеров, делающих посты, интересные "завсегдатаем" и только сейчас "заработавшей" по задумке и в этом форуме?

MP>Или это просто новый трэнд?

MP>Скорее всего это все вместе взятое, помноженное на кризис жанра

1. Не стоит раскидывать словами типа "ламер".
2. Если не ставят оценки, это не обзательно значит "не хочу", "не буду", "страшно"; а может означать "не могу", "не знаю".

MP>С ув.
MP>Marx
Взаимно.

Здравствуйте, uzzy, Вы писали:

U>1. Не стоит раскидывать словами типа "ламер".

И это правильно, uzzy. Обидеть человека легко, но не правильно... ИМХО... Хотя я сам не подарок

U>2. Если не ставят оценки, это не обзательно значит "не хочу", "не буду", "страшно"; а может означать "не могу", "не знаю".

Тоже верно. Особенно, если отвечаешь Анонимам

Здравствуйте, ЖуК, Вы писали:

ЖуК>Тоже верно. Особенно, если отвечаешь Анонимам
ага особенно тем "анонимам" у которых куки слетели .

Здравствуйте, ЖуК, Вы писали:

А насчет behaviours ты не смотрел? В принципе, ничего особо нового там нет. Просто привязка событий и обработчиков там выполнена декларативно (а не императивно, как у тебя). А в остальном — все ровно то же самое. Custom attributes — и вперед с пестней.
Вообще все так делают. У нас вот например ездит textarea с атрибутом maxlength.

З.Ы. Ты обратил внимание, что твой код непригоден при наличии в форме более одного класса объекта, требующего pre-submit обработки? Так что надо их chain-ить (как, впрочем, и onload для окна).

Здравствуйте, Sinclair, Вы писали:

S>Здравствуйте, ЖуК, Вы писали:

S>А насчет behaviours ты не смотрел? В принципе, ничего особо нового там нет. Просто привязка событий и обработчиков там выполнена декларативно (а не императивно, как у тебя). А в остальном — все ровно то же самое. Custom attributes — и вперед с пестней.

behaviours ведь только в IE...

Здравствуйте, anonymous, Вы писали:
A>behaviours ведь только в IE...
Ничего, не расстраивайся — попытки сделать DHTML кроссбраузер-совместимым вполне доведут тебя до седых волос, половина браузеров все равно будет игнорировать самые вкусные вещи, и при этом ты обнаружишь, что дополнительная, по сравнению с IE, совместимость увеличила твою аудиторию ажно процента на полтора...

Здравствуйте, marx paul, Вы писали:

MP>Достаточно почитать несколько рабочих групп W3C, чтобы понять, что браузеры в будующем будут проглатывать много много больше и позволять будут они намного более свободное программирование.

Что-то у меня от чтения этих групп сложилось абсолютно обратное впечатление. Начинается жёсткий контроль за валидностью результирующего кода, что не может не радовать. Все "лишние" по сути элементы уходят из жизни deprecated.

C Уважением, Andir!

Здравствуйте, anonymous, Вы писали:

A>behaviours ведь только в IE...

Ну в мозилле тоже есть подобная функциональность ... XBL зовётся.

C Уважением, Andir!