Javascript.RU

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

события focus и blur
Здравствуйте! Помогите разобраться со скриптом..
Для начала сам код:
<span class="error_message"></span><br id="before_pass" />
<input id="pass" type="text" size="30" maxlength="30" name="pass" value="Пароль" />

Задача следующая: При фокусе на input'e $('#pass') поменять его тип на password и убрать значение value='Пароль'.
А при отмене фокусу (blur), если пароль не был введен, вернуть обратно type='text' и value='Пароль', иначе оставить все как есть.

Т.к. методом attr просто взять и поменять type с text на password оказалось не возможным, вариантов решения этой задачи осталось два:
либо создавать два input'a, либо работать с одним, удаляя его и добавляя уже с нужным типом. Первый вариант у меня получился, но хотелось бы реализовать алгоритм с одним input'ом.
Вот код, который я написал, он ессно работает не правильно:

$('#pass').val('Пароль');
var pass_true = '<input id="pass" type="password" size="30" maxlength="30" name="pass" value="" />';
var pass_fake = '<input id="pass" type="text" size="30" maxlength="30" name="pass" value="Пароль" />';

$('#before_pass + input').focus(function() 
{
    type = $(this).attr('type');
    if ($(this).val() == 'Пароль' && type == 'text')
    {
        $(this).remove();
        $('#before_pass').after(pass_true);
        /*$('#before_pass + input').focus();*/
    }
    else
    {
        return false;
    }
       	    
});

$('#before_pass + input').blur(function()
{ 
    type = $(this).attr('type');
    if ($(this).val() == '' && type == 'password')
    {
        $(this).remove();
        $('#before_pass').after(pass_fake);
    }
    else
    {
        return false;
    }  
});

Ну вот собсно придумать как это должно работать с одним инпутом у меня пока не получилось...
Ответить с цитированием
  #2 (permalink)  
Старый 24.09.2011, 09:26
Аватар для walik
Профессор
Отправить личное сообщение для walik Посмотреть профиль Найти все сообщения от walik
 
Регистрация: 09.11.2009
Сообщений: 1,101

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<input type="text" id="password" value="Пароль" />
<script>
$('#password').focus(function() {
  if ($(this).attr('type') == 'text') {
    $(this).val('');
    this.setAttribute('type', 'password');
  }
});

$('#password').blur(function() {
  if ($(this).attr('type') == 'password' && $(this).val() == '') {
    $(this).val('Пароль');
    this.setAttribute('type', 'text');
  }
});
</script>


Интересно то что, через JQuery атрибут type не менялся, а вот обычным способом setAttribute, все сработало
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай

Последний раз редактировалось walik, 24.09.2011 в 09:29.
Ответить с цитированием
Ответ


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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Передача параметров в колбэки и дальнейшее их вешанье на события. Gremlin Общие вопросы Javascript 17 13.08.2011 08:54
События window.onfocus и window.onblur в ИЕ FINoM Internet Explorer 10 11.03.2011 05:59
обработчик события focus для окна Сергей Д Internet Explorer 4 22.09.2010 17:33
Обработка события focus для input:text Юрий Шу jQuery 8 02.06.2010 15:57
Явный вызов процедуры обработки события. supchik Общие вопросы Javascript 18 27.01.2009 13:16