使用int和selectbox进行Js验证

时间:2012-03-02 04:39:22

标签: javascript regex validation

我在问我如何正确验证我的表格。

我有一个selectBox(名为persorecepteur)。如果所选项目的值为0,JS将检查4个字段(所有都是整数,我检查了数字位数)(它们的名称是建立,银行,帐户,密钥)。

在表单的最后,我有2个字段也必须经过验证(双重和文本)

所以这就是我所做的:

<script type="text/javascript">
function valider(){
    var ck_name = /^[A-Za-z0-9 ]{3,20}$/;
        var ck_double = /^\d{3}\.\d{2}$/;


        var value = "0";
        if (myForm.persorecepteur.options[myForm.persorecepteur.selectedIndex].value == value ){

            // mist be 14701
            value = "14701";
            if (document.myForm.stablishment.value != value ) {
                document.myForm.establishment.style.backgroundColor="red";
        alert("Must be 14701");
                return false;
            }
            value = "00000";
            if (document.myForm.bank.value != value ) {
                document.myForm.bank.style.backgroundColor="red";
        alert("Must be 00000");
                return false;
            }

            if (document.myForm.account.value.length() != 11 ) {
                document.myForm.account.style.backgroundColor="red";
        alert("You must enter 11 digits");
                return false;
            }

            if (document.myForm.key.value.length() != 2 ) {
                document.myForm.key.style.backgroundColor="red";
        alert("You must enter 2 digits");
                return false;
            }

        }


        if (!ck_double.test(document.myForm.amount.value)) {
        document.myForm.amount.style.backgroundColor="red";
                alert("You must enter the sum like that : abc.de ");
                return false;
            }
    if (!ck_name.test(document.myForm.description.value)) {
        document.myForm.description.style.backgroundColor="red";
        return false;
            }

        return true;
}
</script>

但首先我没有让“价值”不是吗? 我可以像使用.value.length()一样检查长度吗?

感谢帮助我,我是JS的初学者......

修改

<form name="myForm" action="performtransfert" method="POST" onsubmit="return valider();">

        <table width="100%" border="1" cellspacing="0" cellpadding="0">
    <tr>
            <td>Selectionnez un compte en banque a debiter : </td>
            <td>
                <SELECT name="debiteur" size="1">

                    <option value="4">compte facturier (Current acount) - 100.0</option>

                    <option value="7">livret vert (Spare acount) - 1379.98</option>

                </SELECT>
            </td>
        </table>
        <br /><br />

        <table width="100%" border="1" cellspacing="0" cellpadding="0">
    <tr>
            <td><SELECT name="persorecepteur" size="1">
                    <option value="0">Selectionnez l'un de vos comptes si c'est le destinataire

                    <OPTION value="4">compte facturier (Current acount) - 100.0</OPTION>

                    <OPTION value="7">livret vert (Spare acount) - 1379.98</OPTION>

                </SELECT>
                <br /><br />
                Sinon, veuillez remplir le BBAN : <INPUT type=text name="establishment" size="5"> <INPUT type=text name="bank" size="5"> <INPUT type=text name="account" size="13"><INPUT type=text name="key" size="1"> 
            </td>
        </tr>
        </table>



        <br /><br />

        <table width="100%" border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td>Somme à verser : </td>
                <td><INPUT type=text name="amount" size="6"></td>
                <td>Desctiption : </td>
                <td><INPUT type=text name="description" size="45"></td>
            </tr>
        </table>

        <br /><br />
        <input type="submit" value="Valider le payement" />

    </form>

1 个答案:

答案 0 :(得分:0)

我想你是在问你是否必须在问题But first I don't have to make "value" isn't it?中声明变量值?不,您不必,您应该能够比较实际值本身,如下所示 - document.myForm.bank.value == "0"

是的,您可以使用document.myForm.account.value.length而非document.myForm.account.value.length()

查看长度

我建议你开始使用(学习)jQuery验证。它使事情变得更加容易和整洁......

以下简单的jQuery验证适用于您的表单...

$(document).ready(function(){

    $("#myForm").validate({
        rules: {
            amount: {
                required: true,
                number: true
            },
            description: {
                required: true
            },
            establishment: {
                required: function(element) {
                    return $("#persorecepteur").val() == '0'
                },
                number: true
            },
            bank: {
                required: function(element) {
                    return $("#persorecepteur").val() == '0'
                },
                number: true
            },
            account: {
                required: function(element) {
                    return $("#persorecepteur").val() == '0'
                },
                number: true
            },
            key: {
                required: function(element) {
                    return $("#persorecepteur").val() == '0'
                },
                number: true
            }

        },
        messages: {
            amount: {
                required: "Needs entry",
                number: "only numbers allowed"
            },
            description: "Needs entry",
            establishment: {
                required: "Have to enter",
                number: "only numbers allowed"
            },
            bank: {
                required: "Have to enter",
                number: "only numbers allowed"
            },
            account: {
                required: "Have to enter",
                number: "only numbers allowed"
            },
            key: {
                required: "Have to enter",
                number: "only numbers allowed"
            },
        }
    });


    $('#myForm').submit(function() {
        if($("#persorecepteur").val() == '0') {
            if($("#establishment").val() !="" && $("#establishment").val() != "14701") {
                alert("Establishment must be 14701");
                return false;
            } else if($("#bank").val() != "" && $("#bank").val() != "00000") {
                alert("Must be 00000");
                return false;
            } else if($("#account").val() != "" && $("#account").val().length != 11) {
                alert("You must enter 11 digits");
                return false;
            } else if($("#key").val() != "" && $("#key").val().length != 2) {
                alert("You must enter 2 digits");
                return false;
            } 
        }
    });
 });

您必须为表单字段声明ID才能使上述代码生效。