Question

正如标题所示，我的JavaScript下面有一个更好的编码结构或实现。这会在提交到数据库之前检查表单中的ID元素值。

我很想知道我是否可以减少代码大小/可以实现代码重用，这将为我提供未来的一些提示！

感谢。

function validateRunnerID()
{
    var runnerID = document.getElementById('RunnerID').value;
    if (isNaN(runnerID) || runnerID < 1 || runnerID > 9999)
    {
        return "RunnerID: Enter a Integer Value between 1-9999 \n\n";
    }else{
        return "";
    }
}

function validateEventID()
{
    var eventID = document.getElementById('EventID').value;
    if (isNaN(eventID) || eventID < 1 || eventID > 9999)
    {
        return "EventID: Enter a Integer Value between 1-9999 \n\n";
    }else{
        return "";
    }
}

function validateDate()
{
    var checkDate= /^[0-9]{4}\-(0[1-9]|1[012])\-(0[1-9]|[12][0-9]|3[01])/;
    var date= document.getElementById('Date');
    var tof= date.value.match(checkDate);

    return tof? "" : "Date: Enter a Valid Date with parameters: YYYY-MM-DD \n\n";
}

function validateFinishTime()
{
    var finishTime = document.getElementById("FinishTime").value;
    if (finishTime.match(/^[0-9]{2}:[0-9]{2}:[0-9]{2}$/)) 
    {
        return ""
    }else{
        return "Finish Time: Enter a valid Time with parameters: HH:MM:SS \n\n";
    }
}
//  
//
function validatePosition()
{
    var position = document.getElementById('Position').value;
    if (position.length == 0)
    {
        document.getElementById('Position').value = -1;
        return "";
    }else{
        return "";
    }
}
function validateCategoryID()
{
    var categoryID = document.getElementById('CategoryID').value;
    if (categoryID.length == 0)
    {
        document.getElementById('CategoryID').value = -1;
        return "";
    }else{
        return "";
    }
}
function validateAgeGrade()
{
    var ageGrade = document.getElementById('AgeGrade').value;
    if (ageGrade.length == 0)
    {
        document.getElementById('AgeGrade').value = -1;
        return "";
    }else{
        return "";
      }
}
function validatePB()
{
    var pBest = document.getElementById('PB').value;
    if (pBest.length == 0)
    {
        document.getElementById('PB').value = 0;
        return "";
    }else{
        return "";
    }
}
//  
//
function validateForm() 
{
    var result = validateRunnerID() + validateEventID() + validateDate() + validateFinishTime() + validatePosition() + validateCategoryID() + validateAgeGrade() + validatePB();

    if ( result == "" )
    { 
        alert("Data Accepted and Submitted \n\n");
        return true; 
    }else{
        alert("Please Fix Errors Listed: \n\n" + result);
        return false;
    }
}

Answer 1

您可以做的一件事是接受elementId作为验证功能的输入。这允许为不同的字段重用相同的逻辑。

例如：

function validate4DigitInt(elementId)
{
    var value = document.getElementById(elementId).value;
    if (isNaN(value) || value < 1 || value > 9999)
    {
        return elementId + ": Enter a Integer Value between 1-9999 \n\n";
    }else{
        return "";
    }
}

现在，您可以使用相同的功能验证RunnerId和EventId：

var result="";
result+=validate4DigitInt("RunnerId");
result+=validate4DigitInt("EventId");

JavaScript的。请告知更好的代码重用和/或结构

1 个答案: