|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>基於Jquery的FormValidator表單驗證外掛程式</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" href="Images/css.css" rel="Stylesheet" />
<script type="text/javascript" src="Scripts/jquery1.2.6.js"></script>
<script type="text/javascript" src="Scripts/jQuery.FormValidator.js"></script>
</head>
<body>
<h5>控制項值不可為空</h5>
<h6>樣本1：</h6>
<fieldset>
<legend>驗證之前，除去控制項值首尾空格。</legend>
<form id="FormDemo01_0" action="Demo.01.htm" method="post">
<dl style="vertical-align:middle;">
<dt>使用者名稱：</dt>
<dd><input type="text" id="UserName0" name="UserName0" /> <tt id="TipUserName0"></tt></dd>
<dd><input type="submit" value="提交" /></dd>
</dl>
</form>
<script type="text/javascript">
$(document).ready(function() {
$("#FormDemo01_0").SetValidateSettings({});
$("#UserName0").SetValidateSettings({
FormValidate: {
Empty: {
Value: true,
Message: "使用者名稱不可為空"
}
},
Message: {
Text: {
Show: "請輸入使用者名稱！",
Success: "輸入正確！",
Error: "必須輸入使用者名稱！",
Focus: "正在輸入..."
},
MessageSpaceHolderID: "TipUserName0"
}
});
});
</script>
</fieldset>
<h6>樣本2：</h6>
<fieldset>
<legend>驗證之前，不除去控制項值首尾空格。</legend>
<form id="FormDemo01_1" action="Demo.01.htm" method="post">
<dl>
<dt>使用者名稱</dt>
<dd><input type="text" id="UserName1" name="UserName1" /> <tt id="TipUserName1"></tt></dd>
<dd><input type="submit" value="提交" /></dd>
</dl>
</form>
<script type="text/javascript">
$(document).ready(function() {
$("#FormDemo01_1").SetValidateSettings({});
$("#UserName1").SetValidateSettings({
FormValidate: {
Empty: {
Value: true,
Message: "使用者名稱不可為空"
}
},
Config: {
AutoTrim: false //取消預設的自動去除首尾空格設定
},
Message: {
Text: {
Show: "請輸入使用者名稱！",
Success: "輸入正確！",
Error: "必須輸入使用者名稱！",
Focus: "正在輸入..."
},
MessageSpaceHolderID: "TipUserName1"
}
});
});
</script>
</fieldset>
</body>
</html> |
