Форум

olegalimov · #1 (**permalink**) 27.09.2015, 16:42

Доброе время суток.
Пожалуйста помогите! Нужен скрипт на 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
как это сделать?
все скрипты перерыл которые у вас форуме есть
мне нужен скрипт чтоб работал под всеми броузерами.

sanmihan · #2 (**permalink**) 27.09.2015, 16:59

var input = document.querySelector("input");
document.querySelector("passEye")

Ошибка в этих строчках, вы пытаетесь навесить событие на элемент по селектору "passEye". http://htmlbook.ru/css/selector
И еще, переменная input ссылается на первый инпут, а это поле логина

olegalimov · #3 (**permalink**) 27.09.2015, 17:18

а в input что указывать class="passEye"?
мне не нужно указывать id="passEye"
потом идет php код который использует идентификатор.

olegalimov · #4 (**permalink**) 27.09.2015, 17:43

вставил как вы сказали. глазик открывает и все, а пароль не переводит в text.
Не пойму в чем ошибка

sanmihan · #5 (**permalink**) 27.09.2015, 18:20

var input = document.querySelector('input[name="pass"]');
document.querySelector(".password-reveal")

olegalimov · #6 (**permalink**) 27.09.2015, 18:46

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>

исправил все равно не работает

sanmihan · #7 (**permalink**) 27.09.2015, 19:00

<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>

olegalimov · #8 (**permalink**) 27.09.2015, 19:19

а на сайте не работает!!!
может конфликт между двумя скриптами?

sanmihan · #9 (**permalink**) 27.09.2015, 19:28

проверьте консоль может там ошибка (открыть консоль можно клавишей F12)

olegalimov · #10 (**permalink**) 28.09.2015, 08:48

отключил скрипт выдвижной панели, скрипт по переводу пароля работает!
может у кого-то есть рабочий, маленький скрипт выдвижной панели с верху?

Форум

Справочник

Discord чат

Курсы javascript