Javascript.RU

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

focus не работает
Подскажите пожалуйста, в чем ошибка. Есть два блока, блок с поиском, и блок с всплывающей подсказкой, который по умолчанию на видимый и должен появляться под блоком с поиском, только при событии фокус. .vvod - блок с поиском, .word - подсказка
Но не работает!(

HTML код:
<form class="fo">
<input class="vvod" type="text">
<input class="but" type="image" src="img/button.png">
</form>

<div class="word"></div>

Css код:
.word{background:url(img/word.png) no-repeat; width:400px; height:45px; display:none;}
.vvod{width:287px; height:22px; margin-top:7px; margin-left:12px; border:white; display:block; float:left; font-size:95%; color:#797979;
}


Скрипт:
<script>
document.getElementByClass('vvod').onfocus = function() {
document.geteElementByClass('word').style.display = 'inline';
}
</script>
Ответить с цитированием
  #2 (permalink)  
Старый 31.03.2013, 17:10
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от Alina25
getElementByClass
Че за метод? Где о нем узнали?
Сообщение от Alina25
geteElementByClass
Зажмите Ctrl и покрутите колесиком мыши вверх.
Ответить с цитированием
  #3 (permalink)  
Старый 31.03.2013, 18:05
Новичок на форуме
Отправить личное сообщение для Alina25 Посмотреть профиль Найти все сообщения от Alina25
 
Регистрация: 31.03.2013
Сообщений: 9

HTML код:
<form class="fo">
<input id="vvod" type="text">
<input class="but" type="image" src="img/button.png">
</form>

<div id="word"></div>

Css код:
#word{background:url(img/word.png) no-repeat; width:400px; height:45px; display:none;}
#vvod{width:287px; height:22px; margin-top:7px; margin-left:12px; border:white; display:block; float:left; font-size:95%; color:#797979;
}


Скрипт:
<script>
document.getElementById('vvod').onfocus = function() {
document.geteElementById('word').style.display = 'block';
}
</script>
Все равно не работает
Ответить с цитированием
  #4 (permalink)  
Старый 31.03.2013, 18:11
Новичок на форуме
Отправить личное сообщение для Alina25 Посмотреть профиль Найти все сообщения от Alina25
 
Регистрация: 31.03.2013
Сообщений: 9

*
Скрипт:
<script>
document.getElementById('vvod').onfocus = function() {
document.getElementById('word').style.display = 'block';
}
</script>
Ответить с цитированием
  #5 (permalink)  
Старый 31.03.2013, 18:34
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Почему. Все работает как и задумывалось:
<style>
#word{
    /*background:url(img/word.png) no-repeat;*/
    background: rgba(0,0,255,0.2);
    width:400px;
    height:45px;
    display:none;
}
#vvod{
    width:287px;
    height:22px;
    margin-top:7px;
    margin-left:12px;
    border:white;
    display:block;
    float:left;
    font-size:95%;
    color:#797979;
}
</style>

<form class="fo">
<input id="vvod" type="text">
<input class="but" type="button" value="Жоп" />
</form>

<div id="word">Подсказка</div>
<script>
document.getElementById('vvod').onfocus = function() {
    document.getElementById('word').style.display = 'block';
}
</script>
Ответить с цитированием
  #6 (permalink)  
Старый 31.03.2013, 18:50
Новичок на форуме
Отправить личное сообщение для Alina25 Посмотреть профиль Найти все сообщения от Alina25
 
Регистрация: 31.03.2013
Сообщений: 9

Подсказка не срабатывает, даже на вашем примере. Возможно дело в браузере?
Ответить с цитированием
  #7 (permalink)  
Старый 31.03.2013, 19:14
Новичок на форуме
Отправить личное сообщение для Alina25 Посмотреть профиль Найти все сообщения от Alina25
 
Регистрация: 31.03.2013
Сообщений: 9

и onfocus должен был срабатывать в области для ввода текста... а не при нажатии на кнопку
Ответить с цитированием
  #8 (permalink)  
Старый 31.03.2013, 19:48
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Ставлю курсор в поле ввода - появляется подсказка. Работает в хроме и лисе точно.
Ответить с цитированием
  #9 (permalink)  
Старый 01.04.2013, 12:31
Новичок на форуме
Отправить личное сообщение для Alina25 Посмотреть профиль Найти все сообщения от Alina25
 
Регистрация: 31.03.2013
Сообщений: 9

Спасибо! Уже все работает! Подскажите пожалуйста, кто-нибудь, где можно промотреть примеры реализации подобного скрипта, но с использованием class вместо id
Ответить с цитированием
  #10 (permalink)  
Старый 01.04.2013, 12:53
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

document.querySelector('.vvod')
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Замена значения в store страно работает I3ev ExtJS 0 09.12.2012 14:22
focus() не работает (полуработает) Демьян Элементы интерфейса 4 17.06.2012 05:34
jQyery функция странно работает! Midel Общие вопросы Javascript 4 08.04.2012 13:40
Не работает код внутри циклов DZHETIGAPA Events/DOM/Window 1 21.06.2011 01:03
Динамическая HTML форма (FireFox - работает, IE - не работает) dm1tr1y Общие вопросы Javascript 10 11.12.2009 15:59