Помощь с формами

Тема в разделе "Другие языки", создана пользователем kinho, 26 май 2010.

Статус темы:
Закрыта.
Модераторы: Цукер
  1. kinho

    kinho

    Регистр.:
    22 мар 2008
    Сообщения:
    268
    Симпатии:
    103
    Доброго времени суток, парни.
    Проблема такая. На сайте каталога две формы поиска такого назначения:
    "Ключевое слово" и/или "адрес"​
    В каждой форме должны быть видны эти самые слова-подсказки, при клике на форму они должны исчезать и, если ничего не вписали в форму для поиска, то при клике на рабочую область сайта слова-подсказки должны снова появиться.
    Подскажите как это реализовать, пожалуйста.
     
  2. shamantc

    shamantc ЗлОй ШаМан

    Заблокирован
    Регистр.:
    3 ноя 2008
    Сообщения:
    655
    Симпатии:
    184
    Если я тебя правильно понял то пробуй так:
    HTML:
    <input name="T1" value="Поиск по сайту..." onblur="if(this.value=='') this.value='Поиск по сайту...';" onfocus="if(this.value=='Поиск по сайту...') this.value='';" type="text" />
    Воткнеш в обычный html файл провериш, а там в шаблон куда приделаеш))
    незабываем говорить спасибо
     
    kinho нравится это.
  3. kinho

    kinho

    Регистр.:
    22 мар 2008
    Сообщения:
    268
    Симпатии:
    103
    Проблема в том, что value="" на обеих формах фактически должен находиться пустой, иначе заполнив одну форму, по второй форме в обработку поиска также уходит слово-подсказка.
    Может быть есть варианты с CSS?
     
  4. jo0o00nyy

    jo0o00nyy Постоялец

    Регистр.:
    12 май 2010
    Сообщения:
    65
    Симпатии:
    27
    Такое можно сделать используя CSS+JS, как на me.com
    Чисто рабочего примера нет, но как принцип, надо поставить <label> "под" <input>. При фокусе поля прятать label, при "уходе" проверять пустое поле или нет.
     
  5. diavolic

    diavolic

    Регистр.:
    17 мар 2010
    Сообщения:
    522
    Симпатии:
    102
    Description: "Show Hint" script displays an attractive hint box containing additional explanation on any item on your page. A hint box pops up next to the item when the mouse moves over it with relevant hints or useful information. A classic use of "Show Hint" is with your form fields, to better explain to the user how to fill them out.

    http://dynamicdrive.com/dynamicindex16/showhint.htm

    так пойдет?
     
  6. gres_18

    gres_18 Pythonобандерівець®

    Регистр.:
    26 апр 2009
    Сообщения:
    407
    Симпатии:
    206
    HTML:
    <label for="login_input" style="position:absolute;" onclick="this.style.display='none';this.nextSibling.focus();">Login</label><input type="text" name="login" id="login_input" onfocus="this.previousSibling.style.display='none';" onblur="if(this.value=='')this.previousSibling.style.display='';" /><br>
    <label for="pass_input" style="position:absolute;" onclick="this.style.display='none';this.nextSibling.focus();">Пароль</label><input type="password" name="password" id="pass_input" onfocus="this.previousSibling.style.display='none';" onblur="if(this.value=='')this.previousSibling.style.display='';" />
    Рабочий кусок кода.
     
    kinho нравится это.
  7. kinho

    kinho

    Регистр.:
    22 мар 2008
    Сообщения:
    268
    Симпатии:
    103
    Этот код пока самый удачный, НО, при срабатывании поиска, в форме остаётся вводимое слово и также обратно появляется подсказка! В результате два слова накладываются друг на друга.
    Не могу пока это исправить.
     
  8. gres_18

    gres_18 Pythonобандерівець®

    Регистр.:
    26 апр 2009
    Сообщения:
    407
    Симпатии:
    206
    А каким образом происходит поиск в таком случае? AJAX чтоли, раз страница не перегружается... Если да, тогда в JS-функции, в которой обращаешься к методу query, напиши что-то вроде
    Код:
    document.GetElementById('id_элемента_input').innerHTML = '';
    чтобы оставить только содержимое элемента label.

    Для приведенных выше примеров, строки будут выглядеть так:
    Код:
    document.GetElementById('login_input').innerHTML = '';
    и
    Код:
    document.GetElementById('pass_input').innerHTML = '';
     
    kinho нравится это.
Статус темы:
Закрыта.