PassEye или "Парольный глаз" (показываем пароль в textBox)
Добрый день.
Подскажите пожалуйста как лучше реализовать кнопку "подглядывания" введенных символов пароля.
Пытаюсь сделать используя эту рекомендацию, но почему то если запихнуть в <span> textBox, то при нажатии на глаз ничего не происходит.
А если реализовать так :
То такая реализация не работает в IE.
Методами тыка было реализован скрипт:
Теперь у меня есть скрипт, который реализовывает моргание глаза :
И мой скрипт, который реализовывает преобразование пароля.
Вопрос: Как мне их соеденить? Как мне перенести мой скрипт, так, чтобы при нажатии на глаз выполнялось преоброзование пароля?
Подскажите пожалуйста как лучше реализовать кнопку "подглядывания" введенных символов пароля.
Пытаюсь сделать используя эту рекомендацию, но почему то если запихнуть в <span> textBox, то при нажатии на глаз ничего не происходит.
Код:
<span class="passEye">
<asp:TextBox ID="tbPassword" runat="server" AutoCompleteType="Disabled" TextMode="Password" MaxLength="30" Width="152" TabIndex="2" />
</span>
<asp:TextBox ID="tbPassword" runat="server" AutoCompleteType="Disabled" TextMode="Password" MaxLength="30" Width="152" TabIndex="2" />
</span>
Код:
<asp:TextBox ID="tbPassword" runat="server" AutoCompleteType="Disabled" TextMode="Password" MaxLength="30" Width="152" TabIndex="2" />
<div onclick="passEye();">click</div>
<script type="text/javascript">
function passEye() {
if (document.getElementById('<%= tbPassword.ClientID %>').type == 'password')
document.getElementById('<%= tbPassword.ClientID %>').type = 'test';
else document.getElementById('<%= tbPassword.ClientID %>').type = 'password';
}
</script>
<div onclick="passEye();">click</div>
<script type="text/javascript">
function passEye() {
if (document.getElementById('<%= tbPassword.ClientID %>').type == 'password')
document.getElementById('<%= tbPassword.ClientID %>').type = 'test';
else document.getElementById('<%= tbPassword.ClientID %>').type = 'password';
}
</script>
Методами тыка было реализован скрипт:
Код:
<div onclick="passEye(document.getElementById();">click</div>
<script type="text/javascript">
function passEye(document.getElementById('<%= tbPassword.ClientID %>')) {
var marker = $('<span />').insertBefore(document.getElementById('<%= tbPassword.ClientID %>'));
if (document.getElementById('<%= tbPassword.ClientID %>').type == 'password') {
$(document.getElementById('<%= tbPassword.ClientID %>')).detach().attr('type', 'text').insertAfter(marker).focus();
marker.remove();
} else {
$(document.getElementById('<%= tbPassword.ClientID %>')).detach().attr('type', 'password').insertAfter(marker).focus();
marker.remove();
}
}
</script>
<script type="text/javascript">
function passEye(document.getElementById('<%= tbPassword.ClientID %>')) {
var marker = $('<span />').insertBefore(document.getElementById('<%= tbPassword.ClientID %>'));
if (document.getElementById('<%= tbPassword.ClientID %>').type == 'password') {
$(document.getElementById('<%= tbPassword.ClientID %>')).detach().attr('type', 'text').insertAfter(marker).focus();
marker.remove();
} else {
$(document.getElementById('<%= tbPassword.ClientID %>')).detach().attr('type', 'password').insertAfter(marker).focus();
marker.remove();
}
}
</script>
Код:
$(function () {
//PassEye by SaD(im-sad@ya.ru)
$(".passEye").append('<span class="eye" title="Показать/скрыть пароль"></span>');
$(".passEye .eye").click(function () {
$(this).toggleClass('openEye');
});
});
//PassEye by SaD(im-sad@ya.ru)
$(".passEye").append('<span class="eye" title="Показать/скрыть пароль"></span>');
$(".passEye .eye").click(function () {
$(this).toggleClass('openEye');
});
});
Вопрос: Как мне их соеденить? Как мне перенести мой скрипт, так, чтобы при нажатии на глаз выполнялось преоброзование пароля?