Javascript $(输入).blur()$(输入)。焦点输出
我有下一个html表单:Javascript $(输入).blur()$(输入)。焦点输出,javascript,jquery,onblur,focusout,Javascript,Jquery,Onblur,Focusout,我有下一个html表单: <form role="form" action="MAILTO:alejandro@distal.com.ar " method="post" enctype="text/plain" id="form-contacto"> <div class="row"> <div id="form-column" class="col-xs-12 col-sm-6 col-md-6 col-lg-6 col-sm-push-3 col
<form role="form" action="MAILTO:alejandro@distal.com.ar " method="post" enctype="text/plain" id="form-contacto">
<div class="row">
<div id="form-column" class="col-xs-12 col-sm-6 col-md-6 col-lg-6 col-sm-push-3 col-md-push-3 col-lg-push-3">
<div class="form-group">
<label for="name" class="sr-only">Nombre:</label>
<input type="textbox" placeholder="ingrese su nombre" name="name" id="name" class="form-control">
<div id="nameRequiredError" class="alert alert-danger" role="alert">El nombre es obligatorio.</div>
<div id="nameFormatError" class="alert alert-danger" role="alert">Solo se permiten letras y puntos.</div>
</div>
<div class="form-group">
<label for="email" class="sr-only">Correo electrónico</label>
<input type="email" placeholder="ingrese su correo electrónico" name="name" id="email" class="form-control">
<div id="emailRequiredError" class="alert alert-danger" role="alert">El dirección de correo electrónico es obligatoria.</div>
<div id="emailFormatError" class="alert alert-danger" role="alert">Ingrese un correo electrónico válido.</div>
</div>
<div class="form-group">
<label for="message" class="sr-only"></label>
<textarea name="" id="message" cols="30" rows="10" class="form-control" placeholder="Escriba su mensaje..." sizable="false"></textarea>
<div id="messageRequiredError" class="alert alert-danger" role="alert">Ingrese un mensaje para enviar.</div>
<div id="messageFormatError" class="alert alert-danger" role="alert">El mensaje no tiene nigún caracter alfanum&eactue;rico.</div>
</div>
</div>
</div>
<div class="row">
<div id="form-column" class="col-xs-6 col-sm-3 col-md-3 col-lg-3 col-xs-push-6 col-sm-push-6 col-md-push-6 col-lg-push-6">
<submit class="btn btn-primary form-control"> Enviar >> </submit>
</div>
</div>
</form>
但这些都不行,知道为什么吗?我疯了!
感谢所有将要阅读此文章的人
http://jsfiddle.net/znty7yoy/1/
这里的所有内容都应该可以使用,但我认为您缺少一件事——DOM在您尝试查询它之前还没有准备好
检查小提琴-如果脚本在HTML之前-这将不起作用,如果在HTML之后-它会起作用
要防止此类情况,只需使用以下材料包装:
$(function () {
$('#name')....
}
您的代码在JS FIDLE中运行良好 但是尝试在
ready
函数中添加事件处理程序。一旦DOM准备好让JavaScript执行,这里的代码将立即运行
$(document).ready(function () {
$('#name').blur(function(event) {
alert("blur: perform validation here");
});
});
此外,为了确保完整性,请确保页面上引用了JQuery JavaScript。没有JQuery,您可以这样做:
var nameEl = document.getElementById("name");
nameEl.addEventListener("blur", function(){
alert("blurry");
});
链接到代码:您是否在jquery就绪函数$(function(){-js here-})中包装了上面的js?也许您应该将其包装在$(document)中。准备好了吗,就像这把小提琴一样:您知道什么是
触发器
吗?
var nameEl = document.getElementById("name");
nameEl.addEventListener("blur", function(){
alert("blurry");
});