如何用代码显示弹出式气球

Question

如果我们有这个代码

<form>
    <input required oninvalid="this.setCustomValidity('error messege')" />
    <input type="submit">
</form>

当我们单击提交按钮时，会显示包含错误消息文本的气球…

现在，如果我们想触发这个气球来显示我们能做什么?例如我们有这样的HTML代码:

<input id="myTextBox" >
<input type="button" onclick="showBalloon()" >
<script>
    function showBalloon(){
        var elem = document.getElementById('myTextBox');
        elem.setCustomValidity('error messege');

        // my problem is HERE !!!
        elem.whichFunctionShouldICallOrWhatToDo(); // this shows balloon of myTextBox
    }
</script>

Answer 1

我认为您已经掌握了主要功能，您只需要一个HTML元素，并修改样式以显示或隐藏。

<div id='myTextBox' style="display: none;"></div> 
// i'd set it in your javascript, but you get the idea
elem.innerHTML = 'error message';
elem.style.display = 'visible'; //show