Safari在调用reportValidity时未显示验证消息

Question

我使用按钮点击来验证表单(而不是表单提交(。按钮在表单内。下面是代码

HTML

<form id="form">
<input type="text" name="name" id="name" required />
<Button id="validate-button" onclick="check()">Validate</Button>
</form>

JavaScript

function check(e){
document.getElementById('form').reportValidity();
}

虽然这在chrome中起到了预期的作用，在那里表单得到了验证，我可以在名称输入字段上看到一个弹出窗口，其中包含消息：Please fill in this field.

然而，在狩猎中，情况并非如此。我可以看到无效的输入得到了关注，但safari浏览器中缺少验证popover消息。

JSFiddle:https://jsfiddle.net/cj6xynu1/

注意：请在safari上查看上面的jsfiddle链接

Answer 1

原来问题是因为按钮上缺少type属性。添加type="button"后，验证消息开始显示在safari中。

工作jsFiddle：https://jsfiddle.net/cj6xynu1/1/

注意：请在safari中查看以上链接