javascript函数只工作一次

我一直在尝试使用java脚本来验证联系人表单。 其想法是在每个文本框上方添加一个段落标记，当单击submit按钮时，应启动一个javascript函数。 如果文本框为空，“隐藏”类将从段落的类列表中删除，因此它将可见 问题是，在我第一次单击按钮时，该函数只启动一次。但如果我填写文本框并再次单击，则该函数不会被触发。 有人能帮我吗？ 注意：如果我使用getElementById，则不会激发函数，编译器会转到服务器端函数BTNSUPmit\u单击，但当使用getElementByName时，函数只激发一次，如上所述

        <div id="contactForm" runat="server">
            <div class="control-group form-group">
                <div class="controls">
                    <p id="errname" class="hidden">You must insert your <b>name</b></p>
                    <input type="text" runat="server" class="form-control" id="txtname" name="txtname" placeholder="*Full Name" >
                </div>
            </div>              
            <div class="control-group form-group">
                <div class="controls">
                    <p id="erremail" class="hidden">You must insert your <b>email</b></p>
                    <input type="email" runat="server" class="form-control" id="txtemail" name="txtemail" placeholder="*Email" >
                </div>
            </div>
            <div class="control-group form-group">
                <div class="controls">
                    <p id="errmessage" class="hidden">You must insert a <b>message</b></p>
                    <textarea runat="server" rows="10" cols="100" class="form-control" id="txtmessage" name="txtmessage" placeholder="*Message" maxlength="999" style="resize:none"></textarea>
                </div>
            </div>
            <asp:Button ID="btnSubmit" runat="server"  OnClientClick="return myfun();" OnClick="btnSubmit_Click"  Text="Send Message" class="btn btn-primary btn-block" />
        </div>

您必须插入您的姓名
您必须插入您的电子邮件
您必须插入一条消息

javascript函数是：

    function myfun() {
        document.getElementById("errname").classList.add('hidden');
        document.getElementById("erremail").classList.add('hidden');
        document.getElementById("errmessage").classList.add('hidden');

        var flag = true;
        if (!document.getElementsById("txtname").value) {
            document.getElementById("errname").classList.remove('hidden');
            flag= false;
        }

        if (!document.getElementsById("txtemail").value) {
            document.getElementById("erremail").classList.remove('hidden');
            flag= false;
        }

        if (!document.getElementsById("txtmessage").value) {
            document.getElementById("errmessage").classList.remove('hidden');
            flag = false;
        }
        if (flag == false) { return false;}

    }
</script>

函数myfun（）{
document.getElementById（“errname”）.classList.add（“隐藏”）；
document.getElementById（“erremail”）.classList.add（“hidden”）；
document.getElementById（“errmessage”）.classList.add（“隐藏”）；
var标志=真；
if（！document.getElementsById（“txtname”）.value）{
document.getElementById（“errname”）.classList.remove（“hidden”）；
flag=false；
}
if（！document.getElementsById（“txtemail”）.value）{
document.getElementById（“erremail”）.classList.remove（'hidden'）；
flag=false；
}
if（！document.getElementsById（“txtmessage”）.value）{
document.getElementById（“errmessage”）.classList.remove（'hidden'）；
flag=false；
}
如果（flag==false）{return false；}
}

这是通过向javascript函数中调用的文本框添加clientMode=“static”来完成的

                    <input type="text" runat="server" class="form-control" id="txtname" name="txtname" placeholder="*Full Name" clientIdMode="static">

---

你的JS永远不会返回true。你有：

if(flag == false) {return false;}

但你永远不会让它回归真实。与上面的行不同，为什么不：

return flag;

---

由于如果出现错误，将值从true更改为false，因此它将返回

标志

的任何值。

文档。getElementsByName

返回一个

HTMLCollection

，因此它没有

值

属性。您的函数确实每次都在运行（请尝试

console.log

），但它不正确。可能与我尝试的document.getElementById重复，并且它也不工作。如果该函数第二次运行，我希望与填充的文本框相关的段落应该隐藏起来。到底是什么不起作用？请回答您的问题并提供答案。使用（点击[code>F12）阅读任何错误。我已编辑了问题并删除了一些与问题无关的代码。希望现在更清楚。此外，我还尝试使用浏览器控制台（开发工具），它不会显示任何错误，只会转到后端代码。该标志在函数开始时返回true