JavaScript開發類工具方法收集(一)
阿新 • • 發佈：2019-02-08
相信大家做專案的時候,都會收集一些有用的小的javasciprt方法,或者開發一些應用於自己業務邏輯的JavaScript方法,但並不是每個專案中都會用到,往往上是專案數量一多,有些可重複使用的方法,在我們忙碌的工作中,卻經常被不經意的忘記在自己的coding中; 其實專案中,比較深刻的感觸到,每個專案中,我們都會有重複開發的一部分程式碼,這並不是因為我們的原因,而是因為專案組與專案組之間的交流太少,都是處於各自封閉的狀態,有一種閉門造車的狀態!因此,有了收集自己在專案中所用到一些JavaScript方法.
1. 限制只能輸入小數,並且只能輸入兩位小數
legionInput Function:
//用於輸入兩位小數,並可以在小數點前增加數字功能
//author: dsy
//date: 20080516
function legionInput(obj, reg, inputStr){
//獲取一個選擇物件範圍
var docSel = document.selection.createRange();
oSel = docSel.duplicate(); //建立選擇範圍複本
oSel.text = "";
var srcRange = obj.createTextRange(); //建立文字範圍
oSel.setEndPoint("StartToStart", srcRange); //設定結束端
var str = oSel.text + inputStr + srcRange.text.substr
(oSel.text.length);
return reg.test(str);
}CheckNumber Function:
/**
* 檢測主入口
* @author dsy
* @param {Object} objId
* @Date 20090523
*/
function CheckNumber(objId){
var obj = document.getElementById(objId);
obj.onkeypress = function(){
if ((event.keyCode < 48 || event.keyCode > 57)
&& event.keyCode != 46) {
event.returnValue = false;
}
else {
return legionInput(this, /^\d*\.?\d{0,2}$/,
String.fromCharCode(event.keyCode));
}
}
}以上函式的使用方法,相當簡單:
廢話少說,上demo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>限制只能輸入數字，並限制小數位</title>
<script type="text/javascript">
//用於輸入兩位小數,並可以在小數點前增加數字功能
//author: dsy
//date: 20080516
function legionInput(obj, reg, inputStr){
//獲取一個選擇物件範圍
var docSel = document.selection.createRange();
oSel = docSel.duplicate(); //建立選擇範圍複本
oSel.text = "";
var srcRange = obj.createTextRange(); //建立文字範圍
oSel.setEndPoint("StartToStart", srcRange); //設定結束端
var str = oSel.text + inputStr + srcRange.text.substr(oSel.text.length);
return reg.test(str);
}
/**
* 檢測主入口
* @author dsy
* @param {Object} objId
* @Date 20090523
*/
function CheckNumber(objId){
var obj = document.getElementById(objId);
obj.onkeypress = function(){
if ((event.keyCode < 48 || event.keyCode > 57) && event.keyCode != 46) {
event.returnValue = false;
}
else {
return legionInput(this, /^\d*\.?\d{0,2}$/, String.fromCharCode(event.keyCode));
}
}
}
window.onload = function() {
CheckNumber("txt4")
}
</script>
</head>
<body>
<input id="txt4" name="txt4" type="text" style="height: 24px;" size="15" />
</body>
</html>按上例所示:
只需在CheckNumber()函式,傳入相應即可完成對輸入是否是數字的限制