Question

我写了一些会检查两个日期的代码 - 它们分为两天输入（＃enddate-1-dd，＃date-1-dd），两个月输入（#enddate-1-mm，＃ date-1-mm）和两年输入（#enddate-1，＃date-1）

我想首先检查一下他们是否真的都是数字，但后来我想检查每一个以确保它是日期格式，此时就像这样：

function validate_form () {

retVal = true; // if the statements below fail, return true

if(retVal == true) {
    // check whether the available hours they've entered are a valid time!
    $(":text").each(function() {
        $this = $(this); // cache the object
        if (isNaN($this.val())) {
            $this.focus();
            $.jGrowl('Please enter a valid date!', { theme: 'smoke' });
            retVal = false; return false;
        }
    });
}

if(retVal == true) {
    $("#date-1-dd").each(function() {
        $this = $(this); // cache the object
        if ($this.val() > 31) {
            $this.focus();
            $.jGrowl('Please enter a valid day, should be no more than 31!', { theme: 'smoke' });
            retVal = false; return false;
        }
    });
}

if(retVal == true) {
    $("#enddate-1-dd").each(function() {
        $this = $(this); // cache the object
        if ($this.val() > 31) {
            $this.focus();
            $.jGrowl('Please enter a valid day, should be no more than 31!', { theme: 'smoke' });
            retVal = false; return false;
        }
    });
}

if(retVal == true) {
    $("#date-1-mm").each(function() {
        $this = $(this); // cache the object
        if ($this.val() > 12) {
            $this.focus();
            $.jGrowl('Please enter a valid month, should be no more than 12!', { theme: 'smoke' });
            retVal = false; return false;
        }
    });
}

if(retVal == true) {
    $("#enddate-1-mm").each(function() {
        $this = $(this); // cache the object
        if ($this.val() > 12) {
            $this.focus();
            $.jGrowl('Please enter a valid month, should be no more than 12!', { theme: 'smoke' });
            retVal = false; return false;
        }
    });
}

if(retVal == true) {
    $("#date-1").each(function() {
        $this = $(this); // cache the object
        if ($this.val() < 1900 || $this.val() > 3000) {
            $this.focus();
            $.jGrowl('Please enter a valid year!', { theme: 'smoke' });
            retVal = false; return false;
        }
    });
}

if(retVal == true) {
    $("#enddate-1").each(function() {
        $this = $(this); // cache the object
        if ($this.val() < 1900 || $this.val() > 3000) {
            $this.focus();
            $.jGrowl('Please enter a valid year!', { theme: 'smoke' });
            retVal = false; return false;
        }
    });
}

return retVal; // return either true or false, depending on what happened up there! ^

}

很抱歉，如果好像我问一个愚蠢的问题，因为我的代码工作正常，我只是认为这是一种垃圾的做法，有很多重复，但我真的不能想到任何方式更有效率地做到这一点？

由于

Answer 1

function validate_form_checks() {
    var error;
    // check whether the available hours they've entered are a valid time!
    $(':text').each(function() {
        if(isNaN($(this).val())) {
            $(this).focus();
            error = 'Please enter a valid date!';
            return false;
        }
    });
    if(error)
        return error;
    $('#date-1-dd, #enddate-1-dd').each(function() {
        if($(this).val() > 31) {
            $(this).focus();
            error = 'Please enter a valid day, should be no more than 31!';
            return false;
        }
    });
    if(error)
        return error;
    $('#date-1-mm, #enddate-1-mm').each(function() {
        if($(this).val() > 12) {
            $(this).focus();
            error = 'Please enter a valid month, should be no more than 12!';
            return false;
        }
    });
    if(error)
        return error;
    $('#date-1, #enddate-1').each(function() {
        if($(this).val() < 1900 || $(this).val() > 3000) {
            $(this).focus();
            error = 'Please enter a valid year!';
            return false;
        }
    });
    if(error)
        return error;
    return true;
}

function validate_form() {
    var result = validate_form_checks();
    if(result === true) {
        return true;
    } else {
        $.jGrowl(result, { theme: 'smoke' });
        return false;
    }
}

当然，验证可以提供所有表单中的错误的反馈，而不仅仅是第一个错误。但是，你知道，更好。

Answer 2

乍一看，您可以从这些相同的部分创建一个函数，并根据需要调用它。 You shouldn't repeat yourself

以下是关于验证可能具有启发性的日期的blog post。这是一个SO答案，它提供了jQuery plugin answer到目前为止的验证。

我可以简化/优化这个Jquery代码吗？

2 个答案: