jquery验证循环产生误报

时间:2014-11-07 15:32:05

标签: javascript jquery validation textbox

$(document).ready( function()
{
// hides the story and error text when the page loads
$('.errorText').hide();
$("#story").hide();

// global variables for the blanks and the textarea forms
var input = $("form").children();
var storyBlank = $('#story').children();

// Main Event on Click
$('button.submit').on( "click", function (event)
{
    // if the form is not validated, highlights errors and prevents the submit from going through
    if(!validate())
    {
        event.preventDefault();
    }
    // if the form is validated, fills the blanks in the story and displays it
    else
    {
        fillInTheBlanks();
    }
});

// Checks to see if there are any empty fields and highlights them if they are empty
function validate()
{
    console.log('validate() initiated')
    var success = false;
    errcnt = 0;
    cnt = 0;

    while (cnt < 9)
    {
        if (input.eq(cnt).val().length == 0)
        {
            errcnt++;
            input.eq(cnt).removeClass("hide");
            console.log('errorcount', errcnt, 'at input', cnt);
        }
        else if (input.eq(cnt).val().length !== 0 && !(input.eq(cnt)).hasClass("hide"))
        {
            input.eq(cnt).addClass("hide");
        }
        cnt++;
    }

    if (errcnt == 0)
    {
        success = true;
    }
    return success;
}

// Fills in the blanks of the story
function fillInTheBlanks()
{
    console.log('fillInTheBlanks() executed');
    var blankCount = 0;
    while (blankCount < 9)
    {
        storyBlank.eq(blankCount).empty().append(input.eq(blankCount).val());
        blankCount++;
    }
    $("#story").show();
}
});

我正在尝试使用9个文本框进行疯狂的libs样式页面输入。我遇到了两个问题。

首先,当我点击提交时所有文本框都为空,只有前四个显示错误(这是在css中完成的,我在所有文本框上都有两个类&#34;错误隐藏&#34;,我删除了class隐藏在我的循环中以显示错误。)

我遇到的第二个问题是,如果我在所有文本框中单击提交文本,我的验证函数errorcount在每个其他文本框中最多会出现4个错误。我甚至尝试过&#39; $(&#39;输入&#39;)。eq(0).val()。length == 0&#39;对于索引中的每个文本框,它每次都返回false。如果它不能满足这个论点的话,我就不会理解它是如何进入的。

1 个答案:

答案 0 :(得分:-1)

我不了解您的问题,但如果输入的验证为空......使用

http://parsleyjs.org/