3

对于需要提交的焦点输出触发 parleys 验证器，并且我正在侦听“字段：已验证”欧芹事件。在此事件处理程序中，我将焦点重新返回到此错误元素。这对 chrome 工作正常，但在 IE 中焦点正在发生到下一个元素并显示两条错误消息，如下图所示。在此处输入图像描述

$(document).ready(function(){
	$('#person').parsley(); // binding parsley to the form
});

window.Parsley.on('field:validated', function(e) {
  // This global callback will be called for any field that fails validation.
   
  if(this.$element.hasClass('parsley-error')){
   
  	this.$element.focus();
  }
});
.div1 {
    margin: 0 auto;
    border: 1px solid gray;
    width: 600px;
    height:600px;
}
.par-error ul{
    list-style: none;
    display: inline;
    color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
	<title></title>
	<link rel="stylesheet" type="text/css" href="index.css">
	<style type="text/css">
		.div1{
			margin: 0 auto;
			border: 1px solid gray;
			width: 600px;
			height:600px;
		}
		.par-error ul{
			list-style: none;
		    display: inline;
		    color: red;
		}
	</style>
</head>
<body>
<div class="div1" id="div1" data-candy="chaco">
	<form id="person" name="person" data-parsley-validate>
		<legend>
			Person Information
		</legend>
		<label for="firtsname">First Name</label>
		<input type="text" id="firtsname" data-parsley-errors-container="#fname-error" data-parsley-trigger="blur" data-parsley-validate-if-empty="true" data-parsley-required="true"  />
		<span class="par-error" id="fname-error"></span>
		<br>
		<label for="lastname">Last Name</label>
		<input data-parsley-focus="none" type="text" id="lastname" data-parsley-errors-container="#lname-error" data-parsley-trigger="blur" data-parsley-validate-if-empty="true" data-parsley-required="true" />
		<span class="par-error" id="lname-error"></span>
		<br>
		<label for="email">Email</label>
		<input type="text" id="email"/><br>
		<label for="dob">DOB</label>
		<input type="text" id="dob"/><br>
		<input type="submit"></input>
	</form>
</div>
<script type="text/javascript" src="jquery-1.12.2.js"></script>
<script type="text/javascript" src="
https://cdnjs.cloudflare.com/ajax/libs/parsley.js/2.3.11/parsley.js">
</html>

请为此需要解决方案。这是 jsbin 链接在此处输入链接描述

4

0 回答 0