index.html
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<title>Input Counter</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link href="stylesheet.css" media="screen" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="application.js" type="text/javascript"></script>
</head>
<body>
<div id="container">
<form action="index.html" method="POST">
<textarea></textarea>
<span class="input-counter"></span>
<input type="submit" id="input-submit" value="등록" />
</form>
</div>
</body>
</html>
stylesheet.js
body {
font-size: 12px;
background: #FFF;
color: #333;
margin: 0;
}
#container {
margin: 10px auto;
width: 500px;
padding: 10px;
background: #CCC;
}
form {
overflow: hidden;
height: 100%;
}
textarea {
display: block;
width: 99%;
height: 5.0em;
margin-bottom: 0.5em;
}
span.input-counter {
float: left;
font-weight: bold;
color: #000;
}
span.input-counter.disabled {
color: #F00;
}
input#input-submit {
float: right;
}
application.js
$(function() {
var maxLength = 140;
function updateInputCount() {
var textLength = $('textarea').val().length;
var count = maxLength - textLength;
$('span.input-counter').text(count);
if (count < 0) {
$('span.input-counter').addClass('disabled');
$('input#input-submit').prop('disabled', true);
} else {
$('span.input-counter').removeClass('disabled');
$('input#input-submit').prop('disabled', false);
}
}
$('textarea')
.focus(updateInputCount)
.blur(updateInputCount)
.keypress(updateInputCount);
window.setInterval(updateInputCount, 100);
updateInputCount();
});
댓글 1개
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 630 | 19년 전 | 2340 | ||
| 629 |
 ⓦangcho |
19년 전 | 2000 | |
| 628 |
ⓦangcho |
19년 전 | 3115 | |
| 627 |
ⓦangcho |
19년 전 | 2020 | |
| 626 |
ⓦangcho |
19년 전 | 2063 | |
| 625 |
ⓦangcho |
19년 전 | 1712 | |
| 624 |
ⓦangcho |
19년 전 | 2213 | |
| 623 | 19년 전 | 2190 | ||
| 622 |
 뜨락의이름 |
19년 전 | 2497 | |
| 621 |
ⓦangcho |
19년 전 | 2894 | |
| 620 |
ⓦangcho |
19년 전 | 2392 | |
| 619 | 19년 전 | 2459 | ||
| 618 | 19년 전 | 3505 | ||
| 617 |
 Elbis |
19년 전 | 3228 | |
| 616 |
Elbis |
19년 전 | 3215 | |
| 615 |
Elbis |
19년 전 | 3028 | |
| 614 |
Elbis |
19년 전 | 2037 | |
| 613 |
Elbis |
19년 전 | 2368 | |
| 612 |
Elbis |
19년 전 | 2228 | |
| 611 |
Elbis |
19년 전 | 2075 | |
| 610 |
Elbis |
19년 전 | 2511 | |
| 609 |
Elbis |
19년 전 | 2415 | |
| 608 |
Elbis |
19년 전 | 2805 | |
| 607 | 19년 전 | 2186 | ||
| 606 | 19년 전 | 3517 | ||
| 605 | 19년 전 | 1978 | ||
| 604 | 19년 전 | 2580 | ||
| 603 | 19년 전 | 1606 | ||
| 602 |
 Dream |
19년 전 | 2830 | |
| 601 | 19년 전 | 3071 | ||
| 600 |
 빨간망토의비밀 |
19년 전 | 2153 | |
| 599 | 19년 전 | 1992 | ||
| 598 | 19년 전 | 2472 | ||
| 597 | 19년 전 | 2385 | ||
| 596 |
ⓦangcho |
19년 전 | 3069 | |
| 595 |
ⓦangcho |
19년 전 | 6747 | |
| 594 | 19년 전 | 2703 | ||
| 593 | 19년 전 | 3183 | ||
| 592 |
 damoa.biz |
19년 전 | 3083 | |
| 591 |
ⓦangcho |
19년 전 | 1922 | |
| 590 | 19년 전 | 3360 | ||
| 589 | 19년 전 | 2203 | ||
| 588 |
ⓦangcho |
19년 전 | 2701 | |
| 587 | 19년 전 | 2343 | ||
| 586 |
 cunic |
19년 전 | 4356 | |
| 585 | 19년 전 | 2479 | ||
| 584 | 19년 전 | 2750 | ||
| 583 |
ⓦangcho |
19년 전 | 3512 | |
| 582 |
ⓦangcho |
19년 전 | 3710 | |
| 581 |
ⓦangcho |
19년 전 | 3242 | |
| 580 | 19년 전 | 2476 | ||
| 579 | 19년 전 | 3059 | ||
| 578 | 19년 전 | 3950 | ||
| 577 | 19년 전 | 3795 | ||
| 576 | 19년 전 | 1735 | ||
| 575 |
ⓦangcho |
19년 전 | 2200 | |
| 574 |
 happycommunity |
19년 전 | 5399 | |
| 573 | 19년 전 | 6707 | ||
| 572 | 19년 전 | 2558 | ||
| 571 | 19년 전 | 2102 | ||
| 570 | 19년 전 | 2599 | ||
| 569 | 19년 전 | 3291 | ||
| 568 | 19년 전 | 3518 | ||
| 567 | 19년 전 | 2979 | ||
| 566 | 19년 전 | 2590 | ||
| 565 |
ⓦangcho |
19년 전 | 4711 | |
| 564 |
ⓦangcho |
19년 전 | 6721 | |
| 563 |
ⓦangcho |
19년 전 | 4987 | |
| 562 |
ⓦangcho |
19년 전 | 5940 | |
| 561 |
ⓦangcho |
19년 전 | 2683 | |
| 560 |
ⓦangcho |
19년 전 | 2525 | |
| 559 |
ⓦangcho |
19년 전 | 2215 | |
| 558 |
ⓦangcho |
19년 전 | 2291 | |
| 557 | 19년 전 | 4588 | ||
| 556 |
 Photofly |
19년 전 | 4655 | |
| 555 | 19년 전 | 2497 | ||
| 554 | 19년 전 | 2170 | ||
| 553 | 19년 전 | 2512 | ||
| 552 |
Photofly |
19년 전 | 3150 | |
| 551 | 19년 전 | 2933 | ||
| 550 |
Elbis |
19년 전 | 1888 | |
| 549 |
Elbis |
19년 전 | 1950 | |
| 548 |
Elbis |
19년 전 | 3138 | |
| 547 |
Elbis |
19년 전 | 2355 | |
| 546 |
Elbis |
19년 전 | 3611 | |
| 545 |
Elbis |
19년 전 | 2538 | |
| 544 |
Elbis |
19년 전 | 1845 | |
| 543 |
Elbis |
19년 전 | 2449 | |
| 542 |
Elbis |
19년 전 | 1720 | |
| 541 |
Elbis |
19년 전 | 1402 | |
| 540 |
Elbis |
19년 전 | 1527 | |
| 539 |
Elbis |
19년 전 | 1794 | |
| 538 |
Elbis |
19년 전 | 1572 | |
| 537 |
Elbis |
19년 전 | 1772 | |
| 536 |
Elbis |
19년 전 | 1557 | |
| 535 |
Elbis |
19년 전 | 1954 | |
| 534 |
Elbis |
19년 전 | 1839 | |
| 533 |
Elbis |
19년 전 | 1438 | |
| 532 |
Elbis |
19년 전 | 1438 | |
| 531 |
Elbis |
19년 전 | 1352 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기