Javascript html表单上的多个验证规则

我有一个类似以下代码的html表单。我的问题是我想基于多个标准进行验证。。。数字可以是0，也可以大于700。我正在使用一个数组作为输入名称，这使得我很难获得一个javascript解决方案。在这种情况下，如何使用多重标准进行验证

<form name="endingweights" method="post">
<input type="hidden" value="1" name="strain[]"></td><td><input type="number" step="any" name="ending[]" min="0" max="1500" required />
<input type="hidden" value="2" name="strain[]"></td><td><input type="number" step="any" name="ending[]" min="0" max="1500" required />
<input type="hidden" value="3" name="strain[]"></td><td><input type="number" step="any" name="ending[]" min="0" max="1500" required />

---

使用以下javascript函数对其进行验证

<script>
function validateForm() {
var x = document.forms["endingweights"].elements["ending[]"];
for (var i = 0; i < x.length; i++) {
var aControl = x[i].value;
if (aControl>0 && aControl<700) {
    alert("Incorrect Weight, must be 0 or greater than 700.");
    x[i].focus();
    return false;
    }
}}
</script>

函数validateForm（）{
var x=document.forms[“endingweights”]。elements[“ending[]”；
对于（变量i=0；i如果（aControl>0&&aControl如果您将
id
分配给您的输入，您将能够更轻松地通过javascript进行验证。这样，您可以在提交表单时检查输入的值

HTML:

<form name="endingweights" method="post">

    <!-- hidden inputs -->
    <input id="foo" type="number" min="0" max="1500" required>
    <input id="bar" type="number" min="0" max="1500" required>
    <input id="baz" type="number" min="0" max="1500" required>
    <input type="submit" value="Submit">
</form>

var form = document.forms['endingweights'],
    foo  = document.getElementById('foo'),
    bar  = document.getElementById('bar'),
    baz  = document.getElementById('baz');

// validate inputs and form
form.addEventListener('submit', function(ev) {

    // stop this from auto submitting
    ev.preventDefault();
    ev.stopPropagation();        

    // make sure constraints are followed
    if ((foo.value !== 0 && foo.value <= 700) ||
        (bar.value !== 0 && bar.value <= 700) ||
        (baz.value !== 0 && baz.value <= 700))
    {
        alert("All input values must be either 0 or greater than 700");
        return false;
    }

    // perform other validations if necessary

    // submit form
    form.submit();

}, false);



JS:

<form name="endingweights" method="post">

    <!-- hidden inputs -->
    <input id="foo" type="number" min="0" max="1500" required>
    <input id="bar" type="number" min="0" max="1500" required>
    <input id="baz" type="number" min="0" max="1500" required>
    <input type="submit" value="Submit">
</form>

var form = document.forms['endingweights'],
    foo  = document.getElementById('foo'),
    bar  = document.getElementById('bar'),
    baz  = document.getElementById('baz');

// validate inputs and form
form.addEventListener('submit', function(ev) {

    // stop this from auto submitting
    ev.preventDefault();
    ev.stopPropagation();        

    // make sure constraints are followed
    if ((foo.value !== 0 && foo.value <= 700) ||
        (bar.value !== 0 && bar.value <= 700) ||
        (baz.value !== 0 && baz.value <= 700))
    {
        alert("All input values must be either 0 or greater than 700");
        return false;
    }

    // perform other validations if necessary

    // submit form
    form.submit();

}, false);

var form=document.forms['endingweights']，
foo=document.getElementById（'foo'），
bar=document.getElementById（'bar'），
baz=document.getElementById（'baz'）；
//验证输入和表单
表单.addEventListener（'submit'，函数（ev）{
//停止此自动提交
ev.preventDefault（）；
ev.stopPropagation（）；
//确保遵守约束条件
如果（（foo.value！==0&&foo.value）像这样使用第三方库总是好的，那么parsleyjs.org虽然有点不完整，但我发现这个解决方案要简单得多。