'Телефонный' ввод пароля стиля с JavaScript
Для тех, у кого такая же проблема: «Не удается подключиться к серверу MySQL на« localhost »(10061)» или «Не удается подключиться к серверу MySQL на« 127.0.0.1 »(10061)». Вы можете установить «MySQL Installer», и это ссылка http://dev.mysql.com/downloads/windows/installer/5.6.html , и это руководство для получения дополнительной помощи https: //www.youtube.com/watch?v=AqQc3YqfelE
это работает для меня, и я тоже хочу работать для вас.
5 ответов
Если сайт действительно предназначен для маленьких детей, почему бы просто не позволить им ввести пароль в текстовое поле? Вы не будете хранить данные их кредитной карты.
Если ребенок (или взрослый, если на то пошло) слишком плохо набирает текст, чтобы использовать поле пароля, вы действительно думаете, что отображение буквы, которую они напечатали несколько секунд, действительно помогает? Разве плохой машинист не сосредоточится на клавиатуре, а не на экране?
Самое простое решение - это, вероятно, сделать что-то вроде поля сетевого пароля в Vista: установить флажок, который переключает между обычным полем ввода и полем пароля (и выберите разумное значение по умолчанию), или, если логин в любом случае не является конфиденциальным, просто используйте простое поле ввода.
Я, вероятно, сделал бы обратное тому, что использую сейчас (со взрослыми), и превратил бы это в возможность для урока для детей.
То есть сделать поле обычным полем ввода, а затем включить ссылку под ним, которая гласит: « СКРЫТЬ ».
Нажатие на ссылку « HIDE » переключит ее на « SHOW » и пометит содержимое поля пароля. Нажатие « SHOW » приведет к обратному.
Я могу представить себе на детском сайте значки вроде « Что это ?». Если это так, переключатель HIDE / SHOW был бы возможностью описать, почему следует скрывать свой пароль.
ПРИМЕР (поперечное сечение. Обратите внимание, что XDOM - это объект, который нормализует функции DOM во всех браузерах. )
...
function init()
{
pwdEl = XDOM.getElementById('pass');
pwdClr = XDOM.getElementById('logindisplay');
toglLnk = XDOM.getElementById('showhidepwd');
pwdClr.style.display = "none"; //initiate
function mirrorType(e)
{
pwdClr.innerHTML = pwdEl.value;
}
function toggleMirror(e)
{
var toggle = pwdClr.style.display;
if (toggle == "none") {
pwdClr.style.display = "inline";
toglLnk.innerHTML = "hide";
} else {
pwdClr.style.display = "none";
toglLnk.innerHTML = "show";
}
pwdClr.innerHTML = pwdEl.value;
XDOM.stopPropagation(e);
XDOM.preventDefault(e);
}
XDOM.addListener(pwdEl, 'keyup', mirrorType, false);
XDOM.addListener(toglLnk, 'click', toggleMirror, false);
}
window.onload = init;
</script>
<style type="text/css">
#logindisplay {display:none;}
.row {display:table-row; padding:4px;}
.cell {display:table-cell; padding:4px;}
</style>
</head>
<body>
<div>
<h2>Test Show-Hide Login</h2>
<form>
<div class="row">
<p class="cell">
<label for="pass">Password</label>
</p>
<p class="cell">
<input type="password" id="pass" name="pass" value="" size="15" maxlength="15" />
<br /><a href="#jsenable" id="showhidepwd"><span id="togglelogin">show</span></a>
<span id="logindisplay" style="display:none;"> </span>
</p>
</div>
</form>
<p id="jsenable"><!-- a note about enabling JavaScript here --></p>
</div>
В дополнение к другим ответам. Вы также можете установить виртуальную клавиатуру рядом с полем пароля. Чтобы они могли нажать и ввести пароль.
Я думаю, у вас должно быть настоящее поле пароля со стилем отображения: нет; вместо скрытого поля; и событие onchange для этого поля, которое запускается только один раз, добавляя маску в ваше текстовое поле доказательства концепции ... так что встроенный в браузер пароль сохранения может работать. Как предлагали другие, переключатель «показать пароль» тоже не повредит. Проблема в том, что автозаполнение сохраненных данных формы имеет тенденцию происходить после события загрузки окна, а также после события готовности dom (используется jquery), поэтому необходимо привязать к onchange скрытого поля пароля.