문자 agent 테스트 문자바이트 계산

This commit is contained in:
hylee 2024-08-07 18:18:04 +09:00
parent 50c3760e66
commit 7b835dfe22
2 changed files with 51 additions and 6 deletions

View File

@ -58,6 +58,7 @@ $(function () {
// 내용
$message.val(msg);
updateByteCount($message);
if (msgType === 'L'
||msgType === 'M'
@ -112,8 +113,41 @@ $(function () {
icon.removeClass('fa-times-circle').addClass('fa-info-circle');
}
});
$('textarea').on('input', function() {
updateByteCount(this);
});
});
// function updateByteCount(textarea) {
// console.log('textarea : ', textarea);
// var text = $(textarea).val();
// var byteLength = new TextEncoder().encode(text).length;
// $(textarea).closest('.form-group').find('.byte-count').text(byteLength + ' bytes');
// }
function updateByteCount(textarea) {
var text = $(textarea).val();
var byteLength = calculateByteLength(text);
$(textarea).closest('.form-group').find('.byte-count').text(byteLength + ' bytes');
}
function calculateByteLength(text) {
var byteLength = 0;
for (var i = 0; i < text.length; i++) {
var charCode = text.charCodeAt(i);
if (charCode <= 0x007F) {
byteLength += 1; // 1 byte for ASCII characters
} else if (charCode <= 0x07FF) {
byteLength += 2; // 2 bytes for characters from U+0080 to U+07FF
} else {
byteLength += 2; // 2 bytes for characters from U+0800 and above (including Hangul)
}
}
return byteLength;
}
function getParentsId($obj){
var $col = $obj.closest('.col-md-6'); // 클릭한 버튼의 가장 가까운 부모 .card 요소 찾기

View File

@ -15,6 +15,14 @@
<link rel="stylesheet" th:href="@{/plugins/datatables-buttons/css/buttons.bootstrap4.min.css}">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<style>
.byte-count {
margin-top: 5px;
font-size: 14px;
color: #555;
}
.custom-height {
height: 100px;
}
.example-button {
border-radius: 20px;
margin-right: 10px;
@ -103,7 +111,7 @@
<div class="col-md-6" id="divOneSms">
<div class="card">
<div class="card-header">
<h3 class="card-title">Client 1 (daltex)</h3>
<h3 class="card-title" th:text="'Client 1 :: '+ ${oneUserId}"/>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
@ -177,8 +185,9 @@
<div class="form-group">
<label for="sendPhone1">메세지 - MESSAGE</label>
<div class="input-group">
<input type="text" class="form-control message" id="message1" name="message" placeholder="메세지 - MESSAGE">
<textarea class="form-control message" id="message1" name="message" placeholder="메세지 - MESSAGE" rows="5" oninput="updateByteCount(this)"></textarea>
</div>
<div class="byte-count">0 bytes</div>
</div>
<div class="form-group">
<label for="slider1">건수 (max 1,000,000 | 백만)</label>
@ -198,7 +207,8 @@
<div class="col-md-6" id="divTwoSms">
<div class="card">
<div class="card-header">
<h3 class="card-title">Client 2 (006star)</h3>
<!-- <h3 class="card-title">Client 2 (006star)</h3>-->
<h3 class="card-title" th:text="'Client 2 :: '+ ${twoUserId}"/>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
@ -268,10 +278,11 @@
</div>
</div>
<div class="form-group">
<label for="sendPhone">메세지 - MESSAGE</label>
<label for="message">메세지 - MESSAGE</label>
<div class="input-group">
<input type="text" class="form-control message" id="message" name="message" placeholder="메세지 - MESSAGE">
<textarea class="form-control message" id="message" name="message" placeholder="메세지 - MESSAGE" rows="5" oninput="updateByteCount(this)"></textarea>
</div>
<div class="byte-count">0 bytes</div>
</div>
<div class="form-group">
<label for="slider">건수 (max 1,000,000 | 백만)</label>