阻止表单提交

阻止表单提交方法很多,网上大都是 通过 JS 阻止 submit 事件, 本文介绍的是个例外。

这里介绍一种简单快捷的方法,通过 CSS。

input:invalid {
    background-color: #ffdddd; /* 未验证通过 input 添加背景色用于指示 */
}
form:invalid button {
    /* 对应表单下面的 button 半透明,并且屏蔽 事件 */
    opacity: 0.4;
    pointer-events: none;
}

简单 DEMO

 

 

 

Post Author: admin