推薦一個自己用的封裝好的javascript插件

2024-05-06 16:15:30

字體：大中小

來源：轉載

供稿：網友

本文推薦給大家一款自用的封裝好的javascript插件，常用的一些檢測全部都涵蓋了，非常實用，推薦給小伙伴們。

具體內容請看注釋，這里就不多BB了，

奉上代碼：

/// <reference path="vendor/jquery-1.4.1-vsdoc.js" />

///檢測表單中的不能為空（.notnull）的驗證

/*

時間：2012-6-6

作用：一對form標簽下有多個（包括一個）表單需要提交時，使用js準確的判斷當前按鈕對那些元素做判斷

用法：在form標簽下找到當前表單的容器給予class="form"，當前表單的提交按鈕給予 class="check"

需要驗證為空的元素給予class="notnull" nullmsg="xx不能為空！"提示，需要進行邏輯判斷的表單給予class="need"

判斷的類型給予 class="num"(只能是數字) 驗證的提示 logicmsg="XX只能是數字"

給予class="errorMessage"顯示錯誤信息塊

給予class="warn"顯示錯誤信息

未使用js面向對象編程

邏輯判斷，不傳入need標識，直接給出正則表達式屬性（自定義）regex="/^/d$/" 做出判斷

在外部實現

Global.submitCallback button回調函數

Global.confirmCallback confirm回調函數;

需要改進的地方：

暫無

更新時間：2014年12月3日 16:23:22

作者：Amber.Xu

*/

//$(document).ready(

// function () {

// $("form").find(".notnull").bind({

// focus: function () {

// if ($(this).attr("value") == this.defaultValue) {

// $(this).attr("value", "");

// }

// },

// blur: function () {

// if ($(this).attr("value") == "") {

// $(this).attr("value", this.defaultValue);

// }

// }

// });

// }

//);

///*封裝一個萬能檢測表單的方法*/

///event.srcElement：引發事件的目標對象，常用于onclick事件。

///event.fromElement：引發事件的對象源，常用于onmouseout和onmouseover事件。

///event.toElement：引發事件后，鼠標移動到的目標源，常用于onmouseout和onmouseover事件。

function Global() {

var _self = this;

}

Global.submitCallback = null;

Global.confirmCallback = null;

$(document).ready(function () {

//form body

$("body").find(".form").each(function () {

this.onclick = function (e) {

var button = null;

try {

button = e.srcElement == null ? document.activeElement : e.srcElement;

} catch (e) {

console.log(e.message)

button = document.activeElement;

}

if ($(button).is(".check")) {

//alert("提交")

var sub = (checkform(this) && CheckInputRex(this) && checkselect(this) && checkChecked(this));

if (sub) {

// Call our callback, but using our own instance as the context

Global.submitCallback.call(this, [e]);

}

return sub;

} else if ($(button).is(".confirm")) {

//alert("刪除")

var sub = confirm($(button).attr("title"));

if (sub) {

Global.confirmCallback.call(this, [e]);

}

return sub;

} else {

// //alert("其它")

return true;

}

}

});

/*檢測表單中不能為空的元素*/

function checkform(form) {

var b = true;

$(form).find(".notnull").each(function () {

if ($.trim($(this).val()).length <= 0) {//|| $(this).val() == this.defaultValue

// if (this.value != null) {

// $(this).attr("value", "");

// }

//alert($(this).attr("msg"))

$(this).parents(".form").find(".warn").text($(this).attr("nullmsg"));

$(this).parents(".form").find(".errorMessage").show();

$(this).select();

$(this).focus();

return b = false;

}

});

if (b == true) {

$(form).find(".warn").text("");

$(form).find(".errorMessage").hide();

}

return b;

}

/*檢測表單中必選的下拉列表*/

function checkselect(form) {

var b = true;

$(form).find(".select").each(function (i) {

var ck = $(this).find('option:selected').text();

if (ck.indexOf("選擇") > -1) {

$(this).parents(".form").find(".warn").text($(this).attr("nullmsg"));

$(this).parents(".form").find(".errorMessage").show();

$(this).select();

$(this).focus();

return b = false;

}

});

return b;

}

/*檢測表單中必選的復選框*/

function checkChecked(form) {

var b = true;

$(form).find(".checkbox").each(function (i) {

var ck = $(this)[0].checked;

if (!ck) {

$(this).parents(".form").find(".warn").text($(this).attr("nullmsg"));

$(this).parents(".form").find(".errorMessage").show();

$(this).select();

$(this).focus();

return b = false;

}

});

return b;

}

//檢查是否匹配該正則表達式

function GetFlase(value, reg, ele) {

if (reg.test(value)) {

return true;

}

$(ele).parents(".form").find(".warn").text($(ele).attr("logicmsg"));

$(ele).parents(".form").find(".errorMessage").show();

$(ele).focus();

$(ele).select();

return false; //不能提交

}

function CheckInputRex(form) {

var b = true;

$(form).find("input[type='text']").each(function () {

if (typeof ($(this).attr("regex")) == 'string') {

if ($.trim($(this).val()).length > 0 && $(this).val() != this.defaultValue) {

//當前表單的值

var value = $(this).attr("value") || $(this).val();

var regx = eval($(this).attr("regex"));

return b = GetFlase(value, regx, this);

}

}

});

return b;

}

///檢查用戶輸入的相應的字符是否合法

///此方法已廢棄

function CheckInput(form) {

var b = true;

$(form).find(".need").each(function () {

if ($.trim($(this).val()).length > 0 && $(this).val() != this.defaultValue) {

//當前表單的值

var value = $(this).attr("value");

//id的值或者name的屬性的值如：[name="contact"]

var name = $(this).attr("class");

//檢查需要輸入的內容是否合法如：聯系方式

var len = name.split(" ");

for (var i = 0; i < len.length; i++) {

switch ($.trim(len[i])) {

///聯系方式

case "mobile":

var reg = /^1/d{10}$/;

return b = GetFlase(value, reg, this);

break;

///郵箱

case "email":

var reg = /^[/w-]+(/.[/w-]+)*@[/w-]+(/.[/w-]+)+$/;

return b = GetFlase(value, reg, this);

break;

///兩次密碼是否一致

case "password":

break;

case "password2":

if ($("#password").attr("value") != $("#password2").attr("value")) {

$(this).select(); //獲取焦點

$(this).parents(".form").find(".warn").text($(this).attr("logicmsg"));

$(this).parents(".form").find(".errorMessage").show();

return b = false; //不能提交

}

break;

case "worktel":

case "hometel": //家庭電話

var reg = /^/d{8}$/;

return b = GetFlase(value, reg, this);

break;

case "post": //郵編

var reg = /^/d{6}$/;

return b = GetFlase(value, reg, this);

break;

case "bonus":

case "allowance":

case "FixedSalary":

var reg = /^-?([1-9]/d*/./d*|0/./d*[1-9]/d*|0?/.0+|0|[1-9]/d)$/;

return b = GetFlase(value, reg, this);

break;

case "identity":

var reg = /(^/d{15}$)|(^/d{18}$)|(^/d{17}(/d|X|x)$)/;

return b = GetFlase(value, reg, this);

break;

case "height":

var reg = /^[1-2][0-9][0-9]$/;

return b = GetFlase(value, reg, this);

break;

case "qq":

var reg = /^[1-9][0-9]{4,}$/;

return b = GetFlase(value, reg, this);

break;

case "begintime":

case "endtime":

var reg = /^/d{4}$/;

if (reg.test(value) && (parseInt($(".endtime").val()) > parseInt($(".begintime").val()))) {

return b;

}

$.ligerDialog.alert($(this).attr("msg"))

$(this).select(); //獲取焦點

return b = false; //不能提交

break;

case "num":

var reg = /^/d+$/;

return b = GetFlase(value, reg, this);

break;

///大陸去香港需要辦理往來港澳通行證和香港的簽注.因私普通護照號碼格式有:

///14/15+7位數,G+8位數；

///因公普通的是:P.+7位數；

///公務的是：S.+7位數或者

//S+8位數,以D開頭的是外交護照

case "postport": //護照號碼

var reg = /^(P/d{7}|G/d{8}|S/d{7,8}|D/d+|1[4,5]/d{7})$/;

return b = GetFlase(value, reg, this);

break;

case "bankaccount":

var reg = /^[0-9]{19}$/;

return b = GetFlase(value, reg, this);

break;

} //switch

} //for

}

});

return b;

}

///此方法已經廢棄

});

///單擊改變背景顏色

$(document).ready(function () {

var inputs = $("#top>.c>input");

$(inputs).each(function () {

this.onclick = function () {

document.getElementById("main").style.backgroundColor = this.name;

//$("#main").backgroundColor = this.name;

}

});

});