自定义输入验证

Question

我在表单上进行了JavaScript验证，每次提交表单时都会清空表单。我需要更改它，当表单填满不完整的空盒子。单击按钮后不会清除所有字段。只有在完全填满后，所有字段才会清晰。

这是我的剧本;

$("#sub").click( function() {
    $.post( $("#myForm").attr("action"), 
        $("#myForm :input").serializeArray(), 
        function(info){ $("#result").html(info); }
    );
    clearInput();
});
$("#myForm").submit( function() {
    return false;   
});

function clearInput() {
    $("#myForm :input").each( function() {
        $(this).val('');
    });
}

Answer 1

以下是描述简单验证的Fiddle。

代码

function submit() {
    if (validate()) {
        // Post Request call
        clearInput();
    }
}

function validate() {
    var valid = true;
    if ($("#txt1").val().length == 0) {
        valid = false;
    }
    if ($("#txt2").val().length == 0) {
        valid = false;
    }
    if ($("#txt3").val().length == 0) {
        valid = false;
    }
    console.log(valid)
    return valid;
}

function clearInput() {
    $("#txt1").val("");
    $("#txt2").val("");
    $("#txt3").val("");
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="txt1">
<input type="text" id="txt2">
<input type="text" id="txt3">
<button onclick="submit()">submit</button>

希望这有帮助！