<!--H5表單驗證：-->
<!--一、-->
<form>
<input class="phone" type="text" placeholder="請輸入手機號碼" required="required" pattern="^[1][0-9]{10}$" oninvalid="setCustomValidity('手機號格式不正確')"/>
<input id='user_name' type='text' placeholder="請輸入手機號碼" name='user_name' required/> <input type='submit'/> </form>
<!--二、-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>正則</title>
</head>
<body>
<form action="#">
<input class="phone" type="text" placeholder="請輸入電話號碼！"/>
<input class="phone" type="text" placeholder="請輸入手機號碼" required="required" pattern="^[1][0-9]{10}$" oninvalid="setCustomValidity('手機號格式不正確')"/>
<input type="submit"/>
</form>
<script type="text/javascript" src="./bootstrap/js/jquery-1.11.3.js"></script>
<script type="text/javascript" src="./bootstrap/js/bootstrap.js"></script>
<script>
$(".phone").blur(function(){ var reg = /^[1][34578][0-9]{9}$/; var val = $(this).val(); if(!reg.test(val)){ alert("手機號格式錯誤！"); }; });
</script>
</body>
</html>
<!--三、-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>江哥討厭IE</title>
</head>
<body>
<input type="text" id="btn_getNum"/>
<input type="button" value="獲得數字" onclick="checkMobile(btn_getNum.value);"/>
<script language="javascript" type="text/javascript"> function checkMobile(str) { if(str==""){ alert("手機號不能爲空！"); } else{ var re = /^1\d{10}$/ if (re.test(str)) { alert("正確"); } else { alert("手機號格式錯誤！"); } } }
</script>
</body>
</html>
<!--四、jQuery實時計算用戶輸入字數 -->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery統計文字個數</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script src="../lib/jquery-1.11.1.js"></script>
</head>
<body>
<ul>
<li>
<span>新聞標題:</span>
<span>
<input id="news_title" name="news_title" type="text" size="60" onkeyup="title_len();" onclick="title_len();" maxlength="80"/>
</span>
<span id="titlelen">0/80</span>
</li>
</ul>
</body>
<script language="javascript" type="text/javascript">
function title_len () { var value = $("#news_title").val().length; if(value==80){ var string="<span style='color: #ff0000'>"+value+"/80</span>" }else { var string="<span style='color: #ff0000'>"+value+"</span>/80" }; $("#titlelen").html(string); };
</script>
</html>
