input value 값 1씩 한꺼번에 증가시키기

· 2014-08-30 (토) 01:30:40 · 10886 · 4
<input type="text" name="line" class="cntA1" value="1">
<input type="text" name="line" class="cntA2" value="2">
<input type="text" name="line" class="cntA3" value="3">
<input type="text" name="line" class="cntA4" value="4">

<a href="javascript:void(0);" onclick="cnt_plus();return false;">1 더하기</a>

<script type="text/javascript">
function cnt_plus() {
 var cnt = $("input:text[name='line']").length;
 for(var i=1; i<=cnt;i++)  { 
  var scd = $(".cntA"+i).val();
  var cc = parseInt(scd) + 1;
  $(".cntA"+i).val(cc);
 }
}
</script>​
|

댓글 4개

2014-08-30 (토) 18:17:53
증가는 되지만 값을 사용하기에는 아니네요..
값을 사용하려면 그래도
class 값이 같으면 되잖아요..
제가 만든건 그냥 input 의value 값을 한번에 +1 시키는 방법입니다.
다른 좋은 방법있으시면 부탁드립ㄴ디ㅏ. ^^
2014-08-31 (일) 13:22:05
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<body>
<input type="text" name="line1" class="cntA1 line" value="1">
<input type="text" name="line2" class="cntA2 line" value="2">
<input type="text" name="line3" class="cntA3 line" value="3">
<input type="text" name="line4" class="cntA4 line" value="4">


<a href="javascript:void(0);" onclick="cnt_plus();return false;">1 더하기</a>

<script type="text/javascript">
function cnt_plus() {
var cnt = $(".line").length;
for(var i=1; i<=cnt;i++) {
var scd = $(".cntA"+i).val();
var cc = parseInt(scd) + 1;
$(".cntA"+i).val(cc);
}
}
</script>​
</body>
</html>

이렇게 하면 4개 의 input 전달할여 사용할수 있습니다.
열매님의 소스를 조금 수정했습니다.^^
약간 다르게 해보자면 ^^

[code]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<body>
<input type="text" name="line1" class="line" value="1">
<input type="text" name="line2" class="line" value="2">
<input type="text" name="line3" class="line" value="3">
<input type="text" name="line4" class="line" value="4">
<a href="#add_one" id="btn_add">1 더하기</a>

<script type="text/javascript">
$('#btn_add').click(function(evt) {
$('.line').each(function(idx, ele) {
$(ele).val(parseInt($(ele).val())+1);
});
evt.preventDefault();
});
</script>
</body>
</html>
[/code]

이왕 jquery 사용하는 김에.. 좀더 jquery 식으로 하면 이렇게도 할 수 있겠습니다
댓글을 작성하시려면 로그인이 필요합니다.

개발자팁

5,403건

개발과 관련된 유용한 정보를 공유하세요. 질문은 QA에서 해주시기 바랍니다.

+
분류 제목 글쓴이 날짜 조회
PHP 14-07-29 조회 4,224
Mobile 14-07-25 조회 4,787
기타 14-07-25 조회 4,100
PHP 14-07-10 조회 3,543
OS 14-07-09 조회 6,724
PHP 14-07-08 조회 4,399
PHP 14-07-05 조회 4,402
기타 14-07-04 조회 1.7만
JavaScript 14-06-28 조회 6,206
JavaScript 14-06-28 조회 4,535
기타 14-06-24 조회 5,090
기타 14-06-24 조회 3,588
MySQL 14-06-24 조회 6,066
기타 14-06-24 조회 7,111
웹서버 14-06-20 조회 3,742
jQuery 14-06-12 조회 5,275
node.js 14-06-06 조회 5,480
기타 14-06-04 조회 5,433
기타 13-10-22 조회 5,732
PHP 14-05-26 조회 9,258
PHP 14-05-26 조회 4,196
PHP 14-05-21 조회 4,056
PHP 14-05-19 조회 1.2만
MySQL 14-05-18 조회 4,566
기타 14-05-18 조회 5,405
PHP 14-05-17 조회 8,729
MySQL 14-05-15 조회 4,193
MySQL 14-05-15 조회 8,828
기타 14-05-15 조회 2,912
MySQL 14-05-13 조회 4,254