javascript - 仅在表单提交时显示 HTML5 验证

Question

我有下面的代码

 <input 
    required 
    pattern="[0-9]{5,10}"
    oninput="setCustomValidity('')" 
    oninvalid="setCustomValidity('Type something')" 
    />

当此元素获得焦点并且显示验证气泡时，如何删除气泡 onkeyup 或至少更改消息？

例如，在下面的演示中，用户提交表单并将必填字段留空，然后在输入消息气泡空白时显示不同的消息

DEMO

Answer 1

好吧，我想我找到了解决方案 为了继续显示我想要的消息，我这样做

if(typeof elm.validity !=='undefined')
    {
        if(typeof msg !=='undefined' && msg!='')
        {
            for(i in elm.validity)
            {
                if (elm.validity[i] === true && i !=='valid' )
                {
                    elm.setCustomValidity(msg);
                    return true;
                }else
                {
                    elm.setCustomValidity('');

                }
            }
        }
    }

为了不让焦点空白，我只需这样做:

$(elm).blur();$(elm).focus();

我将在这里发布完整的示例:

DEMO