如何显示验证弹出窗口之类的弹出窗口？

Question

在表单验证时，不填写必填字段，则HTML5弹出所示：

我想表现出相似的弹出当登录内部数据库已经存在。如何显示相对于登录字段的弹出框？

Answer 1

.wrapper{ 
    position: relative; 
} 

.hint{ 
    position: absolute; 
    left: 50%; 
} 


<div class="wrapper"> 
    <input type="text"> 
    <div class="hint">Login exists</div> 
</div> 

此外，你必须检查登录是否存在使用AJAX。

Answer 2

让您的形式

<form> 
     <input type="text" id="one" required /> 
     <input type="submit" id="sub"></input> 
    </form> 

和jQuery

$(document).ready(function(){ 
    $('#sub').on('click',function(){ 
     var getName=$('#one').val(); 
     //let's assume after checking name, it already exist then go in if condition 
     if(true){ 
     $('#one').val(''); 
     $('#one').attr('data-errormessage-value-missing','already exist'); 
    } 
    }); 
}); 

DEMO