Capítulo 17
Formulários - focus
e blur
JavaScript
<script type="text/javascript">
window.onload = function() {
var fdemo = document.getElementById("fdemo");
var EventUtil = {
addHandler: function(element, type, handler) {
if(element.addEventListener) {
element.addEventListener(type, handler, false);
} else if (element.attachEvent) {
element.attachEvent("on" + type, handler);
} else {
element["on" + type] = handler;
}
}
}
var campoNome = document.forms[0].nome;
var dica = document.getElementById("dica")
EventUtil.addHandler(campoNome, "focus", function(event) {
campoNome.style.background = "#ffc";
dica.innerHTML = "Dica para preenchimento do campo";
});
EventUtil.addHandler(campoNome, "blur", function(event) {
campoNome.style.background = "";
dica.innerHTML = "";
});
}
</script>
HTML
...
<form action="http://www.maujor.com" id="fdemo" method="get">
<label for="nome">Nome:<span id="dica"></span></label>
<input type="text" id="nome" name="nome" />
</form>
...
Arquivos exemplo: « anterior | próximo »