Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Форма поиска (https://javascript.ru/forum/dom-window/2598-forma-poiska.html)

Владимир Новицкий 20.01.2009 19:17

Форма поиска
 
Имеется такая конструкция поля ввода формы поиска:
Код:

<input id="searchInput" onblur="this.value=(this.value=='')?this.title:this.value;" onfocus="this.value=(this.value==this.title)?'':this.value;" value="Search" title="Search" name="search" type="text" />
Данный код подставляет текст в форму поиска, который убирается при получении фокуса. И восстанавливается, если ничего введено не было.

Вопрос, как сделать, чтобы подставляемый текст был одного цвета, а текст, который вводишь сам, другого цвета?
Если в CSS задавать цвет текста для input, то он влияет и на подставляемый, и на вводимый текст.
Как сделать по другому?

P.S. С JS я не знаком...

Octane 20.01.2009 19:33

Меняйте цвет, так же как и сам текст по событиям onblur и onfocus для IE6—7 и для остальных браузеров в CSS нужно записать стили такми образом:
#searchInput {
color: #…; /* onblur */
}
#searchInput:focus {
color: #…;
}

Владимир Новицкий 20.01.2009 20:11

Понял, спасибо. Но можно подробнее, я не знаю семантику js, как написать для IE 6-7?

Octane 20.01.2009 22:33

window.onload = function() { // выполнить после загрузки документа

…

/*@cc_on

    if(@_jscript_version < 5.8) { // только для IE6—7

        var search = document.getElementById('searchInput');

        search.onblur = function() {
            this.style.color = '#f00';
            if(!this.value) this.value = this.title;
       };

        search.onfocus = function() {
            this.style.color = '#00f';
            if(this.value == this.title) this.value = '';
        };
    }

@*/

…

};

Владимир Новицкий 21.01.2009 02:32

Вот спасибо большое! Помогло.


Часовой пояс GMT +3, время: 05:28.