问题描述:

<script type="text/javascript">

function validate() {

if (document.form.price.value.trim() === "") {

alert("Please enter a price");

document.form.price.focus();

return false;

}

if (document.form.price.value !== "") {

if (! (/^\d*(?:\.\d{0,2})?$/.test(document.form.price.value))) {

alert("Please enter a valid price");

document.form.price.focus();

return false;

}

}

return true;

}

</script>

<form action="" method="post" name="form" id="form" onsubmit="return validate(this);">

<input name="price" type="text" class="r2" />

<input name="price2" type="text" class="r2" />

<input name="price3" type="text" class="r2" />

<input name="price4" type="text" class="r2" />

<input name="price5" type="text" class="r2" />

...more....

<input name="price50" type="text" class="r2" />

This javascript code is working fine to validate the field "price".

Question :

How to make the code to work as global validation? Example: would validate the price, price2, price3, price4, price5 etc.. with a single function. Please let me know :)

网友答案:

My personal recommendation would be something like this:

<script type="text/javascript">
function validate() {
    if (validatePrice(document.form.price) && 
        validatePrice(document.form.price2) && 
        validatePrice(document.form.price3) && 
        validatePrice(document.form.price4) && 
        validatePrice(document.form.price5))
       return true;
    else
       return false;
}

function validatePrice(price)
{
    if (price.value.trim() === "") {
        alert("Please enter a price");
        price.focus();
        return false;
    }
    if (price.value !== "") {
        if (! (/^\d*(?:\.\d{0,2})?$/.test(price.value))) {
            alert("Please enter a valid price");
            price.focus();
            return false;
        }
    }
    return true;       
}
</script>
网友答案:

If you do not plan on using jQuery this should work.

function validate() {
    for (var field in document.getElementsByTagName('input')) {
        if (isPriceField(field)) {
            field.value = field.value.trim();
            if (isNaN(parseFloat(field.value))) {
                return alertAndFocus(field, "Please enter a valid price");
            }
        }               
    }

    return true;
}

function isPriceField(field) {
    return (field.name.substr(0, Math.min(5, field.name.length)) === 'price')
}

function alertAndFocus(field, message) {
    alert(message);
    field.focus();
    return false;
}
网友答案:
$('#form input').each(function(){

   console.log('valid',$(this)[0].validity.valid);

});
网友答案:

You can validate all 5 prices and return true only if all 5 match your validation rules.

网友答案:

The easiest in this case is really to use jQuery. This way you can use a generic selector and apply the validation on all items.

$("#price*").each(function() {//Do your validation here $(this) is the item price, then price2 then price3})

For anything else you would need to query the DOM and then that doesn't work the same in all browsers.

Today, you can't really do anything in Javascript and ignore something like jQuery http://docs.jquery.com/ or Scriptalicious.

网友答案:

I use jsFormValidator to validate my form and it works like a charm. You don't need to add heavy syntax to your HTML tags, things like:

 <input type="text" name="username" placeholder="Username" data-validate/>

You just create a basic JSON object to describe how you want to validate your form:

{
"email": {
    "validEmail":true,
    "required":true
},

"username": {
    "minLength":5,
    "maxLength":15
},

"password": {
    "validPassword":true,
    "match": "password",
    "required":true
}

}

And then you just validate the whole form with on single line of code:

  jsFormValidator.App.create().Validator.applyRules('Login'); //Magic!
相关阅读:
Top