使用JavaScript进行实时验证 [英] Live validation using javascript

查看:124
本文介绍了使用JavaScript进行实时验证的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述


  • 我有一个文本框验证在这里。该错误信息不会来作为警告,而不是它会被印在HTML div标签。

HTML:

    <div id="error" style="position:absolute; left:auto; top:7px;"></div>
    <div style="position:absolute; left:auto; top:25px;">
    First name: <input type="text" id="fname" name="fname"><br>
    Last name: <input type="text" id="lname" name="lname"><br>
    <input type="submit" value="Submit" onclick="requiredFields()"><div>

使用Javascript:

Javascript:

function requiredFields(){
    var fName = document.getElementById("fname").value;
    var lName = document.getElementById("lname").value;
    if(fName == ""){
        document.getElementById("error").innerHTML = "First name field cannot be empty";
    }else if(lName == ""){
        document.getElementById("error").innerHTML = "Last name field cannot be empty";
    }else{
        document.getElementById("error").innerHTML = "";
        alert("successful");
    }
}


  • 在点击一个按钮,我打印的错误消息。

  • 我的问题是,有没有现场验证的JavaScript?

  • 我的意思是,在第一次错误消息应该在上点击按钮,时间用户输入值转换成文本框中,如果名字文本框有什么价值,我需要清除错误信息,而无需再次单击该按钮

  • 只是检查我的链接,并帮助我.. http://jsfiddle.net/GACKm/

    just check my link and help me.. http://jsfiddle.net/GACKm/

    推荐答案

    下面是的jsfiddle

    //使用Javascript

    <script type="text/javascript" language="javascript">
        var oneTimeMsgClikced = false;
        function requiredFields() {
            var fName = document.getElementById("fname").value;
            var lName = document.getElementById("lname").value;
            if (fName == "") {
                document.getElementById("error").innerHTML = "First name field cannot be empty";
                oneTimeMsgClikced = false;
            } else if (lName == "") {
                document.getElementById("error").innerHTML = "Last name field cannot be empty";
                oneTimeMsgClikced = false;
            } else {
                document.getElementById("error").innerHTML = "";
                if (oneTimeMsgClikced == false) {
                    alert("successful");
                    oneTimeMsgClikced = true;
                }
            }
        }
    </script>
    

    // HTML code

    <body>
        <div id="error" style="position: absolute; left: auto; top: 7px;">
            Errors here
        </div>
        <div style="position: absolute; left: auto; top: 25px;">
            First name:
            <input type="text" id="fname" name="fname" onblur="requiredFields()" />
            <br />
            Last name:
            <input type="text" id="lname" name="lname" onblur="requiredFields()"/>
            <br />
            <input type="submit" value="Submit" onclick="requiredFields()" />
        </div>
    </body>
    

    这篇关于使用JavaScript进行实时验证的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆