禁用按钮直到表单域不变可以通过以下步骤实现:
<button id="myButton" disabled>提交</button>
var myInput = document.getElementById("myInput");
var myButton = document.getElementById("myButton");
myInput.addEventListener("input", function() {
if (myInput.value !== "") {
myButton.disabled = false;
} else {
myButton.disabled = true;
}
});
在上述代码中,我们使用addEventListener方法为表单域添加了一个input事件监听器。当表单域的值发生变化时,会触发该事件,并执行相应的操作。
button:disabled {
opacity: 0.5;
cursor: not-allowed;
}
在上述代码中,我们使用了:disabled伪类选择器来选择禁用状态的按钮,并为其添加了一些样式。
这样,当表单域的值为空时,按钮将被禁用,直到表单域的值发生变化。一旦表单域的值发生变化,按钮将变为可用状态,用户可以点击提交按钮。
推荐的腾讯云相关产品:腾讯云云服务器(CVM)和腾讯云云函数(SCF)。
领取专属 10元无门槛券
手把手带您无忧上云