基本验证javascript工作不正常

Basic Validate javascript not working correctly

本文关键字:工作 不正常 javascript 验证      更新时间:2023-09-26

这是我的简单代码,如果插入了错误的文本,我一直在使用它来显示有效或无效,但我遇到的问题是,当我点击回车键时,有效和无效闪烁而不停留在屏幕上。

这是我的Fiddle

function validate ()
{
    var me = document.getElementById("my").value;
    if (me == 'my')
    {
        document.getElementById("Result").innerHTML = "valid";
        document.getElementById("Result").style.color = "green";
    }
    else
    {
        document.getElementById("Result").innerHTML = "invalid";
        document.getElementById("Result").style.color = "red";
    }
}
<form>
    <button type="button" onclick ="yes" class="fa fa-search"></button>
    <input type="text" id="my" onchange="validate()"></input>
    <label id="Result"></label>
</form>

我犯的错误是什么?我该怎么解决?

问题是您的代码在标记中。如果你想留在页面上,你需要阻止表单提交。

我没有在这里包含CSS!!

<div class="container">
    <div id="nav">
        <div id="search">
            <form id="form1">
                <button type="button" onclick ="yes" class="fa fa-search"></button>
                <input type="text" id="my"></input>
                <label id="Result"></label>
            </form>
        </div>
    </div>
</div>
$(document).ready(function(){ 
    $("#form1").submit(function(event){ 
        if ( !validate()) {
            alert("Error");
            event.preventDefault(); 
            return false;
        }
    }); 
});      
function validate ()
{
    var me = document.getElementById("my").value;
    if (me == 'my')
    {
        document.getElementById("Result").innerHTML = "valid";
        document.getElementById("Result").style.color = "green";
        return true;
    }
    else
    {
        document.getElementById("Result").innerHTML = "invalid";
        document.getElementById("Result").style.color = "red";
        return false;
    }
}

这是一把小提琴。希望它能有所帮助。