<div class="container">
<label>QQ</label><input type="text" id="inp1"><span></span><br>
<label>手機</label><input type="text" id="inp2"><span></span><br>
<label>暱稱</label><input type="text" id="inp3"><span></span><br>
<label>密碼</label><input type="password" id="inp4"><span></span><br>
<label>郵箱</label><input type="text" id="inp5"><span></span><br>
</div>
</body>
<script type="text/javascript">
var g = function(id){return document.getElementById(id);}
var changed = function(id, fn){
g(id).onchange = fn;
}
var setNextHtml = function(id, html){
g(id).nextSibling.innerHTML = html;
}
var val = function(id){
return g(id).value;
}
changed('inp1', function(){
if(/^\d{5,11}$/.test(val('inp1'))){
setNextHtml('inp1', '');
}else{
setNextHtml('inp1', '06 QQ號碼為5到11位數字');
}
});
changed('inp2', function(){
if(/^1\d{12}$/.test(val('inp2'))){
setNextHtml('inp2', '');
}else{
setNextHtml('inp2', '手機號為數字1開頭，13位的數字');
}
});
changed('inp3', function(){
if(/^[\w\-\u4e00-\u9fa5]{1,7}$/.test(val('inp3'))){
setNextHtml('inp3', '')
}else{
setNextHtml('inp3', '暱稱為1到7位')
}
});
changed('inp4', function(){
if(/^[A-Z]\w{1,15}$/.test(val('inp4'))){
setNextHtml('inp4', '');
}else{
setNextHtml('inp4', '密碼為首字母大寫，1到16位');
}
});
changed('inp5', function(){
if(/^[\w\-\.]+\@[\w]+\.[\w]{2,4}/.test(val('inp5'))){
setNextHtml('inp5', '')
}else{
setNextHtml('inp5', '請輸入正確郵箱格式')
}
});
</script>