validate表单验证插件(jquery.validate.messages_cn.js)
$(linkimage).jqzoom({options})
$(textbox).autocomplete(urlData,[options]);
$(Id).focusColor(color)
$(form).validate({options})
<script type="text/javascript">
$(function () {
$("#frmV").validate(
{
/*自定义验证规则*/
rules: {
email:{
required:true,//必填
email:true
}
},
/*错误提示位置*/
errorPlacement: function (error, element) {
error.appendTo(".tip");
}
}
);
});
</script>
form表单验证插件(jquery.form.js)
$(form). ajaxForm ({options})
<script type="text/javascript">
$(function () {
var options = {
url: "https://www.imooc.com/data/form_f.php",
target: ".tip"
}
$("#frmV").ajaxForm(options);
});
</script>
该插件可以用圆角的方式展示选择中的图片,使用按钮查看上下张图片,在加载图片时自带进度条,还能以自动播放的方式浏览图片
$(linkimage).lightBox({options})
<script type="text/javascript">
$(function () {
$(".divPics a").lightBox({
overlayBgColor: "#666", //图片浏览时的背景色
overlayOpacity: 0.5, //背景色的透明度
containerResizeSpeed: 600 //图片切换时的速度
})
});
</script>
$(linkimage).jqzoom({options})
<script type="text/javascript">
$(function () {
$("#jqzoom").jqzoom({
//绑定图片放大插件jqzoom
zoomWidth: 123, //小图片所选区域的宽
zoomHeight: 123, //小图片所选区域的高
zoomType: 'reverse' //设置放大镜的类型
});
});
</script>
保存:$.cookie(key,value);读取:$.cookie(key),删除:$.cookie(key,null)
<script type="text/javascript">
$(function () {
if ($.cookie("email")) {
$("#email").val($.cookie("username"));
}
$("#btnSet").bind("click",function(){
if($("#chksave").is(":checked")){
$.cookie("email",$("#email").val(),{
path:'/',expires:7
});
}else{
$.cookie("email",null,{
path:'/'
})
}
});
});
</script>
$(textbox).autocomplete(urlData,[options]);
<script type="text/javascript">
$(function () {
var arrUserName = ["王五", "刘明", "李小四", "刘促明", "李渊", "张小三", "王小明"];
$("#txtSearch").autocomplete(arrUserName,{
minChars: 0, //双击空白文本框时显示全部提示数据
formatItem: function (data, i, total) {
return "<I>" + data[0] + "</I>"; //改变匹配数据显示的格式
},
formatMatch: function (data, i, total) {
return data[0];
},
formatResult: function (data) {
return data[0];
}
}).result(SearchCallback);
function SearchCallback(event, data, formatted) {
$(".tip").show().html("您的选择是:" + (!data ? "空" : formatted));
}
});
</script>
contextmenu右键菜单插件(jquery.contextmenu.js)
<script type="text/javascript">
$(function () {
$("#divtest").contextMenu('sysMenu',
{ bindings:
{
'Li3': function (Item) {
$(".tip").show().html("您点击了“保存”项");
},
'Li4': function (Item) {
$(".tip").show().html("您点击了“退出”项");
}
}
});
});
</script>
$(Id).focusColor(color)
<script type="text/javascript">
$(function () {
//调用自定义的插件
$('#u1').focusColor("#FF9B77");
})
</script>
$.addNum(p1,p2) 和 $.subNum(p1,p2)
<script type="text/javascript">
$(function () {
$("#btnCount").bind("click", function () {
$("#Text3").val($.subNum($("#Text1").val(),$("#Text2").val()));
});
$("#addCount").bind("click", function () {
$("#Text6").val($.addNum($("#Text4").val(),$("#Text5").val()));
});
});
</script>