배열에 클릭할때마다 추가
본문
var menu = new Array(4);
빈배열 5개 공간만들어 두고
1 2 3 4 5 6 7 이라는 메뉴가 있다고 가정하고
클릭한 순서가 3 2 1 4 5 이라면
순서대로 배열에 값이 3 2 1 4 5이렇게 들어가게 할수있을까요?
제가 하면 클리하면 하지만 [ , , , ,5 ] <- 여기에 5들어간 부분만 바뀌고.. 추가 추가가 안되고있습니다..
메뉴라서 메뉴클릭하면 페이지 이동하면서 새로 고침이 되고 있긴합니다..
답변 3
아래의 코드로 테스트해보세요.
1. 클릭한 순서대로 배열에 추가한다.
2. 클릭한 값이 이미 존재한다면 삭제하고 배열의 마지막에 추가한다.
<button type="button" class="aaa" style="width:60px;">1</button>
<button type="button" class="aaa" style="width:60px;">2</button>
<button type="button" class="aaa" style="width:60px;">3</button>
<button type="button" class="aaa" style="width:60px;">4</button>
<button type="button" class="aaa" style="width:60px;">5</button>
<button type="button" class="aaa" style="width:60px;">6</button>
<button type="button" class="aaa" style="width:60px;">7</button>
<button type="button" class="aaa" style="width:60px;">8</button>
<script>
var arr = []; // 클릭한 값을 담을 배열을 전역변수로 선언
$(document).ready(function() {
$(".aaa").click(function() {
//var ix = $(this).index();
var v = $(this).text();
makeArr(arr, v);
console.log(arr);
});
});
function makeArr(array, val) {
var chk = array.indexOf(val);
if (chk==-1){
array.push(val); // 값이 없다면 배열의 마지막에 추가
}else{
array.splice(chk, 1); //삭제하고
array.push(val); // 마지막에 추가한다.
}
}
</script>
<script>
$(function() {
//var menus = [];
$("a").on("click", function(e) {
e.preventDefault();
$(this).parent().clone().insertAfter($("#result"));
//menus.unshift($(this).data("idx"));
//console.log(menus);
});
});
</script>
<ol>
<li><a href="#" data-idx="1">1111</a></li>
<li><a href="#" data-idx="2">22</a></li>
<li><a href="#" data-idx="3">33333</a></li>
<li><a href="#" data-idx="4">4444</a></li>
<li><a href="#" data-idx="5">555555</a></li>
<li><a href="#" data-idx="6">666</a></li>
</ol>
<ol id="result"></ol>
메뉴를 이용하실 거면 이런 식으로만 해도 되지 않을까 싶네요.
배열에 집어넣으실 경우엔 위 주석 부분 해제하시면 될 것 같습니다.
메뉴클릭하면 페이지 이동하면서 <---이렇게 페이지가 이동 해버리는데 배열값이 남아 잇을 수가 없죠
메뉴 링크에서 값을 전달하도록 링크를 만들고 head부분에서 넘어온 값을 php session 또는 쿠키로
저장하는 방법으로 하세요
세션 이나 쿠키 값을 읽어서 자바스크립트 배열로 만들면 됩니다
답변을 작성하시기 전에 로그인 해주세요.
