728x90
이메일 정규식 마스킹처리 공유하며 보안관점으로는 서버에서 하는걸 추천한다.
[실행결과]
[소스코드]
<!DOCTYPE html>
<html>
<head>
<title>데모</title>
<style>
.divTbl { display: table; width: 100%; }
.divTblRow { display: table-row; }
.divTblCell { display: table-cell; border: 1px solid #999999; padding: 3px 10px; }
button { height: 30px; line-height: 17px; margin-top: 10px; }
textarea { height: 314px; width: 668px; position: fixed; }
</style>
<script src="https://code.jquery.com/jquery-2.1.0.min.js" integrity="sha256-8oQ1OnzE2X9v4gpRVRMb1DWHoPHJilbur1LP9ykQ9H0=" crossorigin="anonymous"></script>
<script>
var com = {
utils : {}
};
com.utils = {
/**
* @description 이메일 마스킹하는 함수.
* @param {string} email(ex:xxxx@abc.com)
* @param {string} 마스킹 타입(EMAIL, ID, NAME, PHONE 기타등등)
* @return {string} 마스킹 처리된 문자열
*/
makeMask: function (t, s) {
var maskedValue = '';
switch (t) {
// 앞 2자리만 표시 처리 (ex : mi******@gmail.com)
case 'EMAIL' :
var len = s.toString().split('@')[0].length - 3; //
maskedValue = s.replace(new RegExp('.(?=.{0,' + len + '}@)', 'gi'), '*');
break;
}
// Log
$('#txtLog').append('입력값 : |' + s + '| >> 출력값 : |' + maskedValue + '\n\n');
return maskedValue;
},
};
</script>
</head>
<body>
<h1>이메일 마스킹 처리</h1>
<div class="divTbl" style="height:330px;">
<div class="divTblRow">
<div class="divTblCell" style="width:150px;">
<button onclick="com.utils.makeMask('EMAIL', 'sealove3904@naver.com')">
앞 두자리만 표시처리
</button>
<button onclick="com.utils.makeMask('EMAIL', '1234567890@gmail.com')">
앞 두자리만 표시처리
</button>
</div>
<div class="divTblCell" style="width:500px">
<textarea id='txtLog'></textarea>
</div>
</div>
<div>
</body>
</html>
[첨부파일]
728x90
반응형
'UI > JavaScript(자바스크립트)' 카테고리의 다른 글
| [자바스크립트] 카드 유효기간 마스킹 처리하기 (0) | 2022.10.07 |
|---|---|
| [자바스크립트] 카드번호 마스킹 처리하기 (0) | 2022.10.07 |
| [자바스크립트] 문자열 길이(Byte) 구하는 함수 (0) | 2022.10.05 |
| [자바스크립트] 좌우 특정문자 채우기 (0) | 2022.10.05 |
| [자바스크립트] 문자열 공백제거하는 함수 (0) | 2022.10.05 |