Показать пароль в поле ввода нужен скрипт
Доброе время суток.
Пожалуйста помогите! Нужен скрипт на javascript или на jQuery в форме есть 2 скрипта один работает, а второй нет.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Вход в ispmanager 5</title>
<script src="jquery.js" type="text/javascript"></script>
<script src="slidebox.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$("#testZone").slideBox({width: "100%", height: "139px", position: "top"});
});
</script>
</head>
<body>
<div id="testZone">
<form>
<table width="300px">
<!-- <tr>
<td style="font-size:18px; color:#FFFFFF; font-family: Georgia, "Times New Roman", Times, serif;"
width=195px; nowrap="nowrap" align="center">Вход панель хостинга</td>
</tr> -->
<td><table>
<tr>
<td width="20px"><img src="http://webvm.ru/images/isp/control1.jpg" width="20" height="20" alt="Логин" /></td>
<td width="50px"><input style="width: 140px" name="login" type="text" placeholder="Username" /></td>
<td class="isp-button" width="120px"><a href="http://billing.webvm.ru:8080/order.php" target="_blank">Регистрация</a></td>
</tr>
<tr>
<td width="20px"><img src="http://webvm.ru/images/isp/1327308370_te_322299.png" width="20" height="20" alt="Пароль" /></td>
<td width="50px"><input style="width: 140px" name="pass" type="password" placeholder="Password" />
<button tabindex="-1" aria-hidden="true" class="password-reveal" type="button"><img src="http://webvm.ru/images/isp/eye2.png" /></button>
<script>
(function () {
var input = document.querySelector("input");
document.querySelector("passEye").addEventListener("click", function () {
if (input.getAttribute('type') != 'text') {
input.setAttribute('type', 'text');
} else {
input.setAttribute('type', 'password');
}
});
})();
</script>
</td>
<td class="isp-button" width="120px" height="40px"><a href="http://billing.webvm.ru:8080/forgotpass.php" target="_blank">Забыл пароль?</a></td>
</tr>
</table></td>
</tr>
<tr>
<td><table>
<tr>
<td width="60px"> </td>
<td width="60px"><input type="submit" value="Вход"/></td>
<td><input type="button" value="Купить домен" onclick="window.open('http://panel.webvm.ru/OFFERTA/offerta_add_select_type.khtml','_blank')" /></td>
<!-- <td width="60px"><a href="http://billing.webvm.ru:8080/order.php" target="_blank">Регистрация</a></td>
<td><a href="http://billing.webvm.ru:8080/forgotpass.php" target="_blank">Забыл пароль?</a></td>
-->
</tr>
</table></td>
</tr>
</table>
</form>
</div>
</body>
</html>
в поле пароля есть глазик, при нажатие пароль не переводиться в text как это сделать? все скрипты перерыл которые у вас форуме есть мне нужен скрипт чтоб работал под всеми броузерами. |
var input = document.querySelector("input");
document.querySelector("passEye")
Ошибка в этих строчках, вы пытаетесь навесить событие на элемент по селектору "passEye". http://htmlbook.ru/css/selector И еще, переменная input ссылается на первый инпут, а это поле логина |
а в input что указывать class="passEye"?
мне не нужно указывать id="passEye" потом идет php код который использует идентификатор. |
вставил как вы сказали. глазик открывает и все, а пароль не переводит в text.
Не пойму в чем ошибка |
:cray:
var input = document.querySelector('input[name="pass"]'); document.querySelector(".password-reveal") |
http://javascript.ru/forum/newreply....reply&p=389904
<td width="50px"><input style="width: 140px" name="pass" type="password" placeholder="Password" />
<button tabindex="-1" aria-hidden="true" class="password-reveal" type="button"><img src="http://webvm.ru/images/isp/eye2.png" /></button>
<script>
(function () {
var input = document.querySelector('input[name="pass"]');
document.querySelector(".password-reveal").addEventListener("click", function () {
if (input.getAttribute('type') != 'text') {
input.setAttribute('type', 'text');
} else {
input.setAttribute('type', 'password');
}
});
})();
</script>
исправил все равно не работает |
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>title</title>
</head>
<body>
<div id="testZone">
<form>
<table>
<tr>
<td width="20px"><img src="http://webvm.ru/images/isp/control1.jpg" width="20" height="20" alt="Логин" /></td>
<td width="50px"><input style="width: 140px" name="login" type="text" placeholder="Username" /></td>
</tr>
<tr>
<td width="20px"><img src="http://webvm.ru/images/isp/1327308370_te_322299.png" width="20" height="20" alt="Пароль" /></td>
<td width="50px"><input style="width: 140px" name="pass" type="password" placeholder="Password" />
<button tabindex="-1" aria-hidden="true" class="password-reveal" type="button"><img src="http://webvm.ru/images/isp/eye2.png" /></button>
<script>
(function () {
var input = document.querySelector('input[name="pass"]');
document.querySelector(".password-reveal").addEventListener("click", function () {
if (input.getAttribute('type') != 'text') {
input.setAttribute('type', 'text');
} else {
input.setAttribute('type', 'password');
}
});
})();
</script>
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
|
а на сайте не работает!!!
может конфликт между двумя скриптами? |
проверьте консоль может там ошибка (открыть консоль можно клавишей F12)
|
отключил скрипт выдвижной панели, скрипт по переводу пароля работает!
может у кого-то есть рабочий, маленький скрипт выдвижной панели с верху? |
| Часовой пояс GMT +3, время: 22:50. |