한번 클릭에 이벤트가 여러변 실행돼서 나와요...
본문
HTML
<ul id="wrapper">
<li>
<input type="text">
<input type="text" value="" readonly>
<select>
<option value="123">선택1</option>
<option value="가나다">선택2</option>
<option value="abc">선택3</option>
</select>
<button type="button" class="apply_btn">적용</button>
</li>
</ul>
<button type="button" class="add_btn">추가하기</button>
JAVASCRIPT
var add_li = $('#wrapper').html();
$('.add_btn').click(function(){
$('#wrapper').append(add_li);
});
$(document).on('click','li',function(){
$('.apply_btn').click(function(){
var $val = $(this).closest('li').find('select').val();
if($(this).closest('li').find('input').eq(1).val() == ''){
$(this).closest('li').find('input').eq(1).val($val);
} else {
var $all_val = $(this).closest('li').find('input').eq(1).val();
$(this).closest('li').find('input').eq(1).val($all_val + ',' + $val);
}
});
});
안녕하세요.
select에서 option을 선택하고 apply_btn을 누르면 value값이 한번만 들어가는게 아니고 여러번 들어갑니다.
어제 도움을 받아서 기존 value값 + 새로운 value값 이렇게 누적되는거 까진 적용이 됐는데요.
만약 첫번째 option인 <option value="123">선택1</option>을 선택하고 apply_btn을 누르면
123,123,123,123,123 이렇게 들어갑니다...게다가 4개가 나올때도 있고 6개가 나올때도 있는데
어떻게 하면 한개만 나오게 할 수 있을까요...?
도움 부탁드립니다^^
!-->!-->답변 2
.add_btn 클릭이벤트를 밖으로 빼야할거같네요
<script>
var add_li = $('#wrapper').html();
$('.add_btn').click(function(){
$('#wrapper').append(add_li);
});
$(document).on('click','.apply_btn',function(){
var $val = $(this).closest('li').find('select').val();
if($(this).closest('li').find('input').eq(1).val() == ''){
$(this).closest('li').find('input').eq(1).val($val);
} else {
var $all_val = $(this).closest('li').find('input').eq(1).val();
$(this).closest('li').find('input').eq(1).val($all_val + ',' + $val);
}
});
</script>
$(function(){
// 요부분애 감싸 해보세요.
)}
답변을 작성하시기 전에 로그인 해주세요.