ловить нажатие кнопок в JavaScript без взаимодействия с сервером - PullRequest
Новая
       20

ловить нажатие кнопок в JavaScript без взаимодействия с сервером

1 голос
/ 04 сентября 2008

У меня есть форма регистрации, которая требует от пользователя ввести свой адрес электронной почты и пароль, оба находятся в двух отдельных текстовых полях. Я хочу предоставить кнопку, которую пользователь может нажать, чтобы пароль (который был замаскирован) появился во всплывающем окне, когда пользователь нажимает кнопку.

В настоящее время мой код JavaScript для этого выглядит следующим образом: 

    function toggleShowPassword() {       
        var button = $get('PASSWORD_TEXTBOX_ID');
        var password;
        if (button)
        {
            password = button.value;
            alert(password);
            button.value = password;  
        } 
   }

Проблема в том, что каждый раз, когда пользователь нажимает кнопку, пароль очищается как в Firefox, так и в IE. Я хочу, чтобы они могли видеть свой пароль в текстовом виде для проверки без необходимости повторного ввода пароля.

Мои вопросы:

  1. Почему поле пароля продолжает сбрасываться при каждом нажатии кнопки?

  2. Как я могу сделать так, чтобы поле пароля НЕ очищалось, когда пользователь увидел свой пароль открытым текстом?

Ответы [ 8 ]

1 голос
/ 04 сентября 2008

В вашем HTML: 

<input type="button" onclick="toggleShowPassword();">

Вам нужно использовать "кнопку", а не "отправить", чтобы запретить публикацию формы.

1 голос
/ 04 сентября 2008

Я сделал быстрый пример рабочей версии: 

<html>
    <head>
        <script type="text/javascript" src="prototype.js"></script>
        <script type="text/javascript">
            function toggleShowPassword() {       
                var textBox = $('PasswordText');
                if (textBox)
                {
                    alert(textBox.value);  
                } 
            }
        </script>
    </head>
    <body>
        <input type="password" id="PasswordText" /><input type="button" onclick="toggleShowPassword();" value="Show Password" />
    </body>
</html>

Ключ в том, что ввод имеет тип кнопки и не представляет. Я использовал библиотеку prototype для извлечения элемента по ID.

1 голос
/ 04 сентября 2008

Если вы не хотите, чтобы кнопка отправляла форму, убедитесь, что она имеет тип «кнопка», а не «отправить». Например, вы можете сделать что-то вроде этого: 

<input type="button" value="Show My Password" onclick="toggleShowPassword()"/>
1 голос
/ 04 сентября 2008

Вы не сказали, что используете ASP.NET, но ...

По своему дизайну ASP.NET очищает во время обратной передачи значение элементов управления TextBox, для которых Mode является Password. Я работаю над этим в подклассе со следующим кодом: 

// If the TextMode is "password", the Text property won't work
if ( TextMode == System.Web.UI.WebControls.TextBoxMode.Password )
    Attributes[ "value" ] = stringValue;
1 голос
/ 04 сентября 2008

Звучит так, что вы делаете запрос к серверу при каждом нажатии, поле пароля, сбрасываемое при каждой загрузке страницы, является типичным поведением браузеров.

1 голос
/ 04 сентября 2008

Я бы предположил, что браузер имеет некоторые проблемы со скриптом, пытающимся установить значение поля пароля: 

button.value = password;

Эта строка кода не имеет реальной цели. password.value не затрагивается в предыдущих строках, где вы читаете значение и используете его в alert().

Это должна быть более простая версия вашего кода: 

function toggleShowPassword() {       
    var button = $get('PASSWORD_TEXTBOX_ID');
    if (button)
    {
        alert(button.value);
    }

}

edit: на самом деле я только что провел быстрый тест, и Firefox без проблем установил значение поля пароля с помощью кода, такого как button.value = "blah". Так что не похоже, чтобы это было так ... Я бы проверил, не вызывает ли ваш код ASP.NET обратную передачу, как предлагали другие.

0 голосов
/ 04 сентября 2008

ха!

ответ, если здесь: http://forums.asp.net/p/1067527/1548528.aspx

Я нашел решение ... исправление было простым изменением 

  OnClientClick="myOnClick()"

до 

  OnClientClick="return myOnClick()"

Вот полностью исправленный код ...

function myOnClick () { // выполнить другие действия ... вернуть ложь; } Страница без названия

0 голосов
/ 04 сентября 2008

Вам не нужно делать button.value = password;, так как чтение значения не меняет его. Я не уверен, почему он очищается, возможно, JavaScript не позволяет изменять значения полей пароля.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...