Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Изменение цвета кнопки при активном поле (https://javascript.ru/forum/jquery/38917-izmenenie-cveta-knopki-pri-aktivnom-pole.html)

paradox989 07.06.2013 22:45

Изменение цвета кнопки при активном поле
 
Здравствуйте!
Подскажите пожалуйста!
Пол дня по интернету лажу и ничего сделать не могу.
Проблема какая:
есть форма с одним полем и одной кнопкой...
Задача: сделать так что-бы при активации формы(когда пользователь начинает что-то вводить) кнопка изменяла цвет!
Вот код кнопки:

<p><input name="name" type="text" style="width:140px; " value="Ваш телефон:" onfocus="if(this.value==this.defaultValue)this.val ue='';" onblur="if(this.value=='')this.value=this.defaultV alue;" /></p>
</td>
<td>
<div class="field">
<p><input value="Отправить сообщение" type="submit" /></p></div>

danik.js 07.06.2013 22:57

<p><input name="name" type="text" style="width:140px; " placeholder="Ваш телефон:" /></p>
<div class="field">
<p><input value="Отправить сообщение" type="submit" /></p></div>
<script src="//code.jquery.com/jquery-latest.min.js"></script>
<script>
$('input[type="text"]').one('input', function(){
  $('input[type="submit"]').css('background', 'red');
});
</script>


IE8- лесом..

paradox989 07.06.2013 23:04

СПАСИБО огромное
 
УРА ПОЛУЧИЛОСЬ:))))) БЛАГОДАРЮ ТЕБЯ ВЕЛИКИЙ МОЗГ:)))):dance:

devote 07.06.2013 23:06

danik.js,
судя по всему не только IE8 идет лесом, это в Опере:
Цитата:

[07.06.2013 23:02:33] JavaScript - http://javascript.ru/forum/jquery/38...vnom-pole.html
console.log
<p><input name="name" type="text" style="width:140px; " placeholder="Ваш телефон:" /></p>
<div class="field">
<p><input value="Отправить сообщение" type="submit" /></p></div>
<script src="//code.jquery.com/jquery-latest.min.js"></script>
<script>
$('input[type="text"]').one('input', function(){
$('input[type="submit"]').css('background', 'red');
});
</script>
[07.06.2013 23:02:33] JavaScript - http://lookatcode.com/showhtml
Inline script thread
Uncaught exception: ReferenceError: Security error: attempted to read protected variable
[07.06.2013 23:02:33] JavaScript - http://lookatcode.com/showhtml
Inline script thread
Uncaught exception: ReferenceError: Undefined variable: $
Error thrown at line 6, column 0 in http://lookatcode.com/showhtml:
$('input[type="text"]').one('input', function(){

danik.js 08.06.2013 00:29

devote, ну это к делу не относится. Ошибка возникает еще до моего кода. Видимо косяк в последней jQuery при запуске внутри фрейма. ХЗ, бесит меня опера своими закидонами...

devote 08.06.2013 01:08

Цитата:

Сообщение от danik.js
бесит меня опера своими закидонами...

а опера тут причем? если джуквери лезит на верхний уровень из фрейма, о чем собственно и тведит опера: Uncaught exception: ReferenceError: Security error: attempted to read protected variable что нельзя, нефиг лезть туда куда не положено.

devote 08.06.2013 01:15

Цитата:

Сообщение от danik.js
IE8- лесом..

и если уж ИЕ8 лесом, то зачем тогда джуквери нужен?
<p><input name="name" type="text" style="width:140px; " placeholder="Ваш телефон:" /></p>
<div class="field">
<p><input value="Отправить сообщение" type="submit" /></p></div>
<script>
(function(){
    document.querySelector('input[type="text"]').addEventListener('input', function fn(){
        this.removeEventListener('input', fn, false);
        document.querySelector('input[type="submit"]').style.background = 'red';
    }, false);
})();
</script>

danik.js 08.06.2013 10:08

Цитата:

Сообщение от devote
а опера тут причем?

В других браузерах ошибки не наблюдаю.
Цитата:

Сообщение от devote
и если уж ИЕ8 лесом, то зачем тогда джуквери нужен?

Тоже верно. Но мы находимся в разделе jQuery. К тому же поддержку IE8 легко добавить. Через тот же propertychange или хотя бы keypress + paste + drop


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