自定义控件:
(function ($) {
var callbackMethod = function (e) {
if($(e).val()==""){
$(e).val(defaultParam.tipMessage);
}
}
var defaultParam={
tipMessage: "请输入。。。",
callback:callbackMethod
};
$.fn.validation = function (param) {
var parameters = $.extend({},defaultParam,param);
$(this).blur(function () {
parameters.callback(this);
});
$(this).focus(function () {
$(this).val("");
});
return this.each(function () {
var text = $(this).val();
parameters.callback(this);
});
}
})(jQuery);
使用的时候:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<style type="text/css">
.add {
background-color: #f0f2f4;
}
</style>
<script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="Scripts/validate.js" type="text/javascript"></script>
<script type="text/javascript">
var passwordCallBack=function(e){
if ($(e).val().length < 6 && $(e).val().length!=0) {
alert("密码长度小于6");
return;
}
};
$(function () {
$("#name").validation().addClass("add");
$("#password").validation({ tipMessage: "", callback: passwordCallBack });
});
</script>
<body>
名称:<input id="name" value=""/></br>
密码:<input id="password" type="password" />
</body>
</html>