Javascript：链接到按钮的函数不'；行不通

当用户尝试单击按钮时，如果用户提交的某些信息不正确，我想发出警告

<span class="error">*</span>
<label for="email"><span class="register">E-mail</span></label>&nbsp;&nbsp;&nbsp;&nbsp;<span id="emailInfo"></span>
<input type="email" name="email" id="email" required="required" onkeyup="emailCheck()">

<button type="submit" id="button" style="vertical-align:middle" onclick="buttonCheck()"><span>Submit</span></button>

<script>
function emailCheck() {
            var emailReg=/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
            var address=document.getElementById("email").value;

            if (!emailReg.test(address)) {
                document.getElementById("emailInfo").innerHTML="<font color='red'>The email address is available";
                document.getElementById("button").disabled=true;
            } else {
                document.getElementById("emailInfo").innerHTML="";
                document.getElementById("button").disabled=false;
            }
        }

function buttonCheck() {
            if (document.getElementById("button").disabled) {
                alert("Please double check your info")
            }
        }
</script>

*
电子邮件
提交
函数emailCheck（）{
var emailReg=/^（[a-zA-Z]|[0-9]）（\w| \-）+@[a-zA-Z0-9]+\.（[a-zA-Z]{2,4}）$/；
var address=document.getElementById（“电子邮件”）.value；
如果（！emailReg.test（地址））{
document.getElementById（“emailInfo”）.innerHTML=“电子邮件地址可用”；
document.getElementById（“按钮”）.disabled=true；
}否则{
document.getElementById（“emailInfo”）.innerHTML=“”；
document.getElementById（“按钮”）.disabled=false；
}
}
功能臀部（）{
if（document.getElementById（“按钮”）.disabled）{
提醒（“请仔细检查您的信息”）
}
}

---

该按钮实际上已禁用。但是，当我单击按钮时，什么也没有发生。

您无法在禁用的按钮上捕获

单击事件。您可以尝试使用CSS“模拟”禁用按钮的外观，然后捕获单击事件

例如，您可以在CSS中创建一个
禁用的
类：

.disabled {
      background-color: #DDD;
      color: #999;
}

下面是使用您的代码的完整示例：


函数emailCheck（）{
var emailReg=/^（[a-zA-Z]|[0-9]）（\w| \-）+@[a-zA-Z0-9]+\.（[a-zA-Z]{2,4}）$/；
var address=document.getElementById（“电子邮件”）.value；
如果（！emailReg.test（地址））{
document.getElementById（“emailInfo”）.innerHTML=“电子邮件地址可用”；
document.getElementById（“按钮”）.classList.add（“禁用”）；
}否则{
document.getElementById（“emailInfo”）.innerHTML=“”；
document.getElementById（“按钮”）.classList.remove（“禁用”）；
}
}
功能臀部（）{
if（document.getElementById（“按钮”）.classList.contains（'disabled'））{
提醒（“请仔细检查您的信息”）
}
}
。已禁用{
背景色：#DDD；
颜色：#999；
}
*
电子邮件
提交
禁用的表单控件不会对单击事件作出反应。

在您的示例中，用户单击按钮将永远不会触发事件

但是，您可以更改按钮的样式，使其看起来像被禁用了一样，但我不建议这样做，因为用户倾向于相信他们以前对如何工作的了解

最好的方法是始终启用按钮，并在单击时提醒用户，或删除/禁用按钮，但在按钮上方保留一条消息，解释按钮被禁用的原因。
当按钮被禁用时，您不能单击按钮。当有人在输入电子邮件前第一次尝试单击按钮时，我希望会显示警报。我只是稍微改变了你的逻辑。我想这就是你想要的。
我也为您提供了一个更好的电子邮件验证表达式


函数emailCheck（）{
var emailReg=/^\w+（[\.-]？\w+*@\w+（[\.-]？\w+*（\.\w{2,3}）+$/；
var address=document.getElementById（“电子邮件”）.value；
if（电子邮件注册测试（地址））{
document.getElementById（“emailInfo”）.innerHTML=“电子邮件地址可用”；
document.getElementById（“按钮”）.disabled=false；
} 
否则{
document.getElementById（“emailInfo”）.innerHTML=“”；
}
}
功能臀部（）{
var emailReg=/^\w+（[\.-]？\w+*@\w+（[\.-]？\w+*（\.\w{2,3}）+$/；
var address=document.getElementById（“电子邮件”）.value；
如果（！emailReg.test（地址））{
document.getElementById（“按钮”）.disabled=true；
提醒（“请仔细检查您的信息”）；
}
}
*
电子邮件
提交
试着像这样编辑你的条件：if（document.getElementById（“button”）.disabled==true）{}这太神奇了。但我对JavaScript还是新手。你的代码中有我不明白的地方。