`
Kenny.Lee
  • 浏览: 511501 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

分享封装的基于prototype的JavaScript工具类

阅读更多
/*--------------------------------------------------|
| @author KennyLee									|
| @version 2009-8-20								|
| @depend prototype.js Ver 1.6.0.3					|
|--------------------------------------------------*/

//Global defalut variable
var globalTips = {
	textareaMaxLength : 1024
}

// setup validators like: name of validator, default message, /regular
// expression/ !don't forget the / in front and the / in back!!!!
var custom_validators = {
	email : {
		defaultMessage : "This field must contain a valid email address.",
		regExp : /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-\u4e00-\u9fa5])+\.)+([a-zA-Z0-9]{2,4})+$/
	},
	creditcard : {
		defaultMessage : "This field must contain a valid credit card number.",
		regExp : /^((4\d{3})|(5[1-5]\d{2})|(6011))([- ])?\d{4}([- ])?\d{4}([- ])?\d{4}|3[4,7]\d{13}$/
	},
	number : {
		defaultMessage : "This field must have a numerical value.",
		regExp : /^[-]?\d+(\.\d+)?$/
	},
	chinese : {
		defaultMessage : "This field contain Chinese.",
		regExp : /^[\u4e00-\u9fa5]+$/i
	}
}

// Util
var theUtil = {
	changeEmailArray : function(baseArray, type) {
		var result = new Array();
		if ((Object.isArray(baseArray)) && (baseArray.size() > 0)) {
			baseArray.each( function(item) {
				var email = '';
				if (type) {
					if (isEffectiveEmail(item))// push effective E-mail
						email = item;
				} else {
					if (!isEffectiveEmail(item)) // push invalid E-mail
						email = item;
				}
				if (email != '')
					result.push(email);
			})
		}
		return (result.size() > 0) ? result : '';
	},
	// Get checkbox or radio checked elements.
	getCheckedEls : function(elArray) {
		var result = new Array();
		if ((Object.isArray(elArray)) && (elArray.size() > 0)) {
			elArray.each( function(el) {
				if (el.checked) {
					result.push(el);
				}
			})
		}
		return result.size() > 0 ? result : '';
	},
	toggleAllCheckbox : function(checkboxArray, _selected) {
		if ((Object.isArray(checkboxArray)) && (checkboxArray.size() > 0)) {
			checkboxArray.each( function(checkboxEl) {
				checkboxEl.checked = _selected;
			})
		}
	}
}

/**
 * Generate Effective E-mail Array.
 * 
 * @param itemArray
 *            Base Array
 * @return '' if Effective E-mail Array is Empty.
 */
function getEffeEmailArray(itemArray) {
	return theUtil.changeEmailArray(itemArray, true);
}

/**
 * Generate Invalid E-mail Array.
 * 
 * @param itemArray
 *            Base Array
 * @return '' if Invalid E-mail Array is Empty.
 */
function getNotEffeEmailArray(itemArray) {
	return theUtil.changeEmailArray(itemArray, false);
}

// Verify the E-mail Address.
function isEffectiveEmail(emailAddr) {
	return custom_validators['email']['regExp'].test(emailAddr);
}

// Check str if contain chinese
function isContainChinese(str) {
	return custom_validators['chinese']['regExp'].test(str);
}

// Common functions for TEXTAREA
var textareaHelper = Class.create( {
	toString : function() {
		return 'TextareaHelper';
	},
	/**
	 * analyze TEXTAREA's Value to change Array.
	 * <p>
	 * Separators are Enter, Spaces(' ') and Comma(',');
	 * 
	 * @param textareaName
	 * @return Array if success, else return '';
	 */
	analyzeToArray : function(textareaName) {
		var inputText = $(textareaName).value;
		var resultArray = '';
		if (!inputText.blank()) {
			resultArray = $w(inputText.gsub(/\s|\,/, ' '));
		}
		return resultArray;
	},
	// To Restrict the TEXTAREA's Value MaxLength.
	restrictTxtarea : function(textareaName) {
		var testareaEl = $(textareaName);
		var maxLength = globalTips['textareaMaxLength'];
		var currentTotalText = testareaEl.value;
		if (currentTotalText.length > maxLength) {
			var overrideText = currentTotalText.truncate(maxLength, '');
			testareaEl.value = overrideText;
		}
	}
})

// For Checkbox
var checkboxHelper = Class.create( {
	toString : function() {
		return 'CheckboxHelper';
	},
	// Get All Checkbox Elements By Name.
	getAllCheckBox : function(checkboxName) {
		var query = 'input[type="checkbox"][name="' + checkboxName + '"]';
		return $$(query);
	},
	getCheckedCheckbox : function(checkboxName) {
		var checkBoxEls = this.getAllCheckBox(checkboxName);
		return theUtil.getCheckedEls(checkBoxEls);
	},
	// Verify the Checkbox Elements.
	// return true if one of CheckBox Elements by choose
	isNotEmptyCheckBox : function(checkboxName) {
		return this.getCheckedCheckbox(checkboxName) != '';
	},
	// Set TRUE For All Checkbox's selected state.
	selectAllCheckbox : function(checkboxName) {
		var checkboxArr = this.getAllCheckBox(checkboxName);
		theUtil.toggleAllCheckbox(checkboxArr, true);
	},
	// Set FALSE For All Checkbox's selected state.
	clearAllCheckbox : function(checkboxName) {
		var checkboxArr = this.getAllCheckBox(checkboxName);
		theUtil.toggleAllCheckbox(checkboxArr, false);
	},
	// Check was already select all Checkboxes;
	isSelectedAllCheckBox : function(checkboxName) {
		var checkboxArr = this.getAllCheckBox(checkboxName);
		var checkedEls = theUtil.getCheckedEls(checkboxArr);
		return (checkedEls != '') && (checkedEls.size() == checkboxArr.size());
	}
})

// For Radio
var radioHelper = Class.create( {
	toString : function() {
		return 'RadioHelper';
	},
	// Get All Radio Elements by Name.
	getAllRadio : function(radioName) {
		var query = 'input[type="radio"][name="' + radioName + '"]';
		return $$(query);
	},
	getCheckedRadio : function(radioName) {
		var radioEls = this.getAllRadio(radioName);
		return theUtil.getCheckedEls(radioEls)
	},
	// Verify the Radio Elements.
	// return true if one of Radio Elements by choose
	isNotEmptyRadio : function(radioName) {
		return this.getCheckedRadio(radioName) != '';
	}
})

// For Select
var selectHelper = Class.create( {
	toString : function() {
		return 'SelectHelper';
	},
	getSelectedValue : function(selectName) {
		return $F(selectName);
	},
	getSelectedText : function(selectName) {
		var result = '';
		var options = $(selectName);
		$A(options).each( function(option) {
			if (option.selected) {
				result = option.text;
				throw $break;
			}
		})
		return result;
	}
})


有些方法其实有点多此一举,例如return $F()的,但为了有些不懂得prototype的同事也能直观的使用。

主要是select、textarea、checkbox、radio元素的常用方法,还有一些验证e-mail、中文等。
1
0
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics