gpt4 book ai didi

javascript - parsley js 验证 - 优先验证约束和自定义错误消息

转载 作者:行者123 更新时间:2023-11-29 22:01:09 25 4
gpt4 key购买 nike

我试图让这个欧芹验证一次只为确认电子邮件字段显示一条错误消息。我尝试了各种选项,默认情况下 priorityEnabled 也设置为 true。但是仍然会显示两条消息以确认电子邮件消息。

<!Doctype html>
<html>

<head>

<style>
#fullnameErr {
display: inline-block;
}

</style>

<script src="jquery.js"></script>
<script src="parsley.js"></script>

</head>

<body>

<form id="demo-form" data-parsley-validate>

<!-- this field is just required, it would be validated on form submit -->
<label for="fullname">Full Name * :</label>
<input type="text" name="fullname" data-parsley-trigger="change" data-parsley-length="[1,6]" data-parsley-errors-container="#fullnameErr" required />
<div id="fullnameErr"></div>

<!-- this required field must be an email, and validation will be run on
field change -->
<label for="email">Email * :</label>
<input type="email" id="emailid" name="email" data-parsley-trigger="change" required />


<label for="email">Confirm Email * :</label>
<input type="email" name="email" data-parsley-trigger="change" data-parsley-equalto= "#emailid" required data-parsley-stop-on-first-failing-constraint="true" />

<!-- radio and checkbox inputs by default have to be wrapped in a parent
elemnt (here <p>) that will have success and error classes -->
<label for="gender">Gender *:</label>
<p>
M: <input type="radio" name="gender" id="genderM" value="M" required />
F: <input type="radio" name="gender" id="genderF" value="F" />
</p>

<!-- here, field is not required, it won't throw any error if no checkbox
is checked. But if checked, two at least must be checked -->
<label for="hobbies">Hobbies (2 minimum):</label>
<p>
Skiing <input type="checkbox" name="hobbies" value="ski" data-parsley-mincheck="2" />
Running <input type="checkbox" name="hobbies" value="run" />
Eating <input type="checkbox" name="hobbies" value="eat" />
Spleeping <input type="checkbox" name="hobbies" value="sleep" />
Reading <input type="checkbox" name="hobbies" value="read" />
Coding <input type="checkbox" name="hobbies" value="code" />
<p>


<!-- regular select input. Nothing more to add. -->
<label for="heard">Heard us by *:</label>
<select id="heard" required>
<option value="">Choose..</option>
<option value="press">Press</option>
<option value="net">Internet</option>
<option value="mouth">Word of mouth</option>
<option value="other">Other..</option>
</select>

<!-- this optional textarea have a length validator that would be checked on keyup after 10 first characters, with a custom message only for minlength validator -->
<label for="message">Message (20 chars min, 100 max) :</label>
<textarea name="message" data-parsley-trigger="keyup" data-parsley-length="[20, 100]" data-parsley-validation-threshold="10" data-parsley-minlength-message = "Come on! You need to enter at least a 20 caracters long comment.."></textarea>

<input type="submit" />
</form>
<body>

</html>

最佳答案

根据您的要求,第二个字段用于重新确认用户在第一个电子邮件输入中输入的 email-d。因此,在第二个电子邮件输入中,您应该只使用 data-parsley-equalto 而不是 type="email"

因为在第二个输入上设置 type="email" 会导致输入被验证为有效的电子邮件 ID。这是两条消息的原因。您可以将代码设置为:

<!-- this required field must be an email, and validation will be run on
field change -->
<label for="email">Email * :</label>
<input type="email" id="emailid" name="email" data-parsley-trigger="change" required/>

<label for="email">Confirm Email * :</label>
<input name="email" data-parsley-trigger="change" data-parsley-equalto= "#emailid" required />

因此,当您更改第二个输入中的值时,它将被验证为与第一个输入字段中的值相同,而不是针对有效的电子邮件 ID。

关于javascript - parsley js 验证 - 优先验证约束和自定义错误消息,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23702020/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com