1. 程式人生 > >JQuery 根據位元組數擷取字串()

JQuery 根據位元組數擷取字串()

功能:在網頁中顯示過長的字串,擷取指定長度,結尾新增省略號。 

例如: 
testStr = "測試1字串"; 
autoAddEllipsis(testStr, 1); // "測..." 
autoAddEllipsis(testStr, 2); // "測..." 
autoAddEllipsis(testStr, 3); // "測..." 
autoAddEllipsis(testStr, 4); // "測試..." 
autoAddEllipsis(testStr, 5); // "測試1..." 
autoAddEllipsis(testStr, 6); // "測試1..." 
autoAddEllipsis(testStr, 7); // "測試1字..." 


程式碼如下,其中全形半形判斷部分isFull()的邏輯偷懶了,有特殊符號需求的可以自己定製。 

/*
 * 處理過長的字串,擷取並新增省略號
 * 注:半形長度為1,全形長度為2
 * 
 * pStr:字串
 * pLen:擷取長度
 * 
 * return: 擷取後的字串
 */
function autoAddEllipsis(pStr, pLen) {

	var _ret = cutString(pStr, pLen);
	var _cutFlag = _ret.cutflag;
	var _cutStringn = _ret.cutstring;

	if ("1" == _cutFlag) {
		return _cutStringn + "...";
	} else {
		return _cutStringn;
	}
}

/*
 * 取得指定長度的字串
 * 注:半形長度為1,全形長度為2
 * 
 * pStr:字串
 * pLen:擷取長度
 * 
 * return: 擷取後的字串
 */
function cutString(pStr, pLen) {

	// 原字串長度
	var _strLen = pStr.length;

	var _tmpCode;

	var _cutString;

	// 預設情況下,返回的字串是原字串的一部分
	var _cutFlag = "1";

	var _lenCount = 0;

	var _ret = false;

	if (_strLen <= pLen/2) {
		_cutString = pStr;
		_ret = true;
	}

	if (!_ret) {
		for (var i = 0; i < _strLen ; i++ ) {
			if (isFull(pStr.charAt(i))) {
				_lenCount += 2;
			} else {
				_lenCount += 1;
			}

			if (_lenCount > pLen) {
				_cutString = pStr.substring(0, i);
				_ret = true;
				break;
			} else if (_lenCount == pLen) {
				_cutString = pStr.substring(0, i + 1);
				_ret = true;
				break;
			}
		}
	}
	
	if (!_ret) {
		_cutString = pStr;
		_ret = true;
	}

	if (_cutString.length == _strLen) {
		_cutFlag = "0";
	}

	return {"cutstring":_cutString, "cutflag":_cutFlag};
}

/*
 * 判斷是否為全形
 * 
 * pChar:長度為1的字串
 * return: true:全形
 * 			false:半形
 */
function isFull (pChar) {
	if ((pChar.charCodeAt(0) > 128)) {
		return true;
	} else {
		return false;
	}
}