Функции автозапуска jQuery при изменении событий при загрузке страницы - PullRequest
Новая
       20

Функции автозапуска jQuery при изменении событий при загрузке страницы

0 голосов
/ 13 декабря 2010

Я сделал функцию, которая проверяет входные данные для различных типов строк.У меня серьезные проблемы с несколькими вещами.Я вызываю это в форме представить и для каждого ввода в изменить .Я написал свой код ниже, а затем вызов функции.Дело в том, что когда я вызываю его при изменении и обновлении страницы, он автоматически запускает проверки изменений при загрузке страницы и выдает ошибки. 

var Val = {
    'string': function(ident, req, regexp, offset, limit) {
        var ele = $(document.getElementById(ident));
        Val.errors = false;

        if (!ele.val() && req == 1) {
            alert('blank');
            Val.errors = true;
            $("#" + ident + "Error").html("This field cannot be empty.");
            $("#" + ident + "Error").show("fast");
        }else if ((ele.val().length <= offset || ele.val().length > limit) && Val.errors == false) {
            alert('not long enough');
            Val.errors = true;
            $("#" + ident + "Error").html("This field must be between " + offset + " & " + limit + " charecters long");
            $("#" + ident + "Error").show("fast");
        }else if (regexp !== null) {
        switch (regexp) {
            case 'text':
                var regEx = /^([a-zA-Z]+)$/g;
                break;
            case 'number':
                var regEx = /^([0-9]+)$/g;
                break;
            case 'email':
                var regEx = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/g;
                break;
            case 'date':
                var regEx = /^([123]0|[012][1-9]|31)-(0[1-9]|1[012])-(19[0-9]{2}|2[0-9]{3})$/g;
                break;
            case 'alphanum':
                var regEx = /^([a-zA-Z0-9_\-\.]+)$/g;
                break;
            default:
                break;
        }
            if (!regEx.test(ele.val()) && Val.errors == false) {
                alert('not valid');
                Val.errors = true;
                $("#" + ident + "Error").html("This field is not valid");
                $("#" + ident + "Error").show("fast");
            }
        }
        if (!Val.errors){
            $("#" + ident + "Error").hide("fast");
        }
    },

    'send': function() {
        if (!Val.errors) {
            $('#form').submit();
        }
    }
}

Вызов функции: 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Form Validations</title>
<script type="text/javascript" language="JavaScript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" language="JavaScript" src="js/gcui.lsat.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#send').click(function(){
        checkEmail();
        checkUsername();
        Val.send(); 
    });

    $('#emailID').change(checkEmail());
    $('#username').change(checkUsername());


    function checkEmail(){
        Val.string('email', 1, 'username', 10, 100);
    }
    function checkUsername(){
        Val.string('username', 1, 'alphanum', 5, 15);
    }
});
</script>
</head>
<body>
    <form id="form" action="">
        <input type="text" id="email" name="email" title="Email" />
        <input type="text" id="username" name="username" title="Username" />
        <input type="button" id="send" value="Submit" />
    </form>

    Email: <div id="emailError"></div><br/>
    Username: <div id="usernameError"></div>
</body>
</html>

Ответы [ 2 ]

4 голосов
/ 13 декабря 2010 
    $('#emailID').change(checkEmail());

Означает «Выполнить checkEmail и передать возвращаемое значение методу change»

Вы хотите: 

    $('#emailID').change(checkEmail);

Значение «Передать функцию checkEmail методу change»

0 голосов
/ 13 декабря 2010

В вашем $ ('# send'). Click (function () { вы отправляете его два раза. Первый раз, когда вы делаете проверку, и второй раз, когда нажимается кнопка Добавьте строку Return False; сразу после Val.send (), и форум будет отправлен только в том случае, если форма заполнена правильно

...