设置自定义有效性不使用 onchange 鼠标事件显示消息

Question

我看不到任何关于setCustomValidity的消息。我想收到有关更改的气泡消息。我可以看到bordercolor红色，但setCustomValidity什么都没有.

JavaScript 代码：

function CityValidate(input) {
    var reg = new RegExp("^[A-Za-z]+$");
    if (!reg.test(input.value)) {
        input.setCustomValidity("City Name should have letters");
        input.style.borderColor = "red";
    }
}

网页代码：

<input type="text" id="city" value="" size="40" pattern="^[A-Za-z]+$" placeholder="City" required title="Only characters allowed" onchange="CityValidate(this)" />

Answer 1

使用

setCustomValidity 后，您必须使用 reportValidity ：

e.setCustomValidity('Your message here.');
e.reportValidity();