Форум

glanse · #1 (**permalink**) 07.05.2011, 15:43

При вставке браузером сохраненных логина и пароля, фон не меняется.
Есть два класса:

<style>
.text0 {background: url(form.jpg) no-repeat;}
.text1 {background: #FFFFFF;}
</style>

И есть форма:

<form method="post">
<input value="" type="text" class="text0" name="name" onBlur="if(this.value == '') this.className='text0';" onFocus="this.className='text1';"> 
<input value="" type="password" class="text0" name="password" onBlur="if(this.value == '') this.className='text0';" onFocus="this.className='text1';">
<input type="submit" value="OK">
</form>

Все прекрасно работает, при клике по форме фон пропадает, когда курсор убираю - появляется, естественно при условии если форма пустая.
Но когда если браузер сохранил логин и пароль и при загрузке страницы вставил их в формы - фон не пропадает.

Помогите решить проблему, как убрать фон, если браузер вставил данные?

monolithed · #2 (**permalink**) 07.05.2011, 20:58

Сообщение от glanse

браузер вставил данные

переопределить это поведение браузера можно только с помощью обработчика oninput и атрибутов autofocus/autocomplete (html5) в поле ввода

glanse · #3 (**permalink**) 08.05.2011, 15:19

monolithed, большое спасибо за совет. Действительно удобный обработчик событий.
Решил правда вот так (Дожидаюсь загрузки страницы, а потом проверяю есть ли что в формах):

<html>
  <head>
    <style>
  .text0{background: #FFFFFF url(form.jpg) no-repeat;}
  .text1{background: #FFFFFF url(form2.jpg) no-repeat;}
  .text2{background: #FFFFFF;}
  </style>
  <script>
  function inForm()
  {
	if (document.forms.auth[0].value=="" && document.forms.auth[1].value=="")
	{
		document.forms.auth[0].className = 'text0'; 
		document.forms.auth[1].className = 'text1';
	}
  }
  </script>
  </head>
  <body onLoad="inForm();">
  <form class="auth" name="auth" method="post">
  <input type="text" class="text2" name="name_c" onBlur="if(this.value != '') this.className='text2'; if(this.value == '') this.className='text0'; else this.className='text2';" onFocus="this.className='text2';"> 
  <input type="password" class="text2" name="password" onBlur="if(this.value != '') this.className='text2'; if(this.value == '') this.className='text1'; else this.className='text2';" onFocus="this.className='text2';">
  <input type="submit" value="OK">
  </form>
  </body>
  </html>

Форум

Справочник

Discord чат

Курсы javascript