array생성 (push), 순차정렬
프로젝트 성격상 리스트 데이터를 DB로 부터 사용하기 어려운 경우 array를 이용하여 리스트 값을 정의하고 또 다른 array를 사용하여 리스트 우선 순위를 조절하는 스크립트.
테스트
http://relation.co.kr/images_board/board_system_publishing/286/index.php
http://relation.co.kr/images_board/board_system_publishing/286/ls.php
1번째 배열 -> 데이터 저장
2번쨰 배열 -> 카테고리별 데이터 순서 조회 출력
inc_menu.php
<?PHP
$LINK = "ls.php";
$menu_ls = "";
for($i=1; $i<11; $i++)
{
if($i == 1){ $MENU_TIT = "ALL_LS"; }
else { $MENU_TIT = "MENU_"; }
$menu_ls .= "<li><a href='".$LINK."?tab=".$i."' class='off'>".$MENU_TIT.$i."</a></li>";
}
?>
<?PHP
include "./inc_menu.php";
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>RELATION.CO.KR_5_275</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>
<link rel="stylesheet" type="text/css" href="./css.css">
</head>
<body>
<div class="wrap">
<div class="menu_area">
<div class="menu_box">
<ul>
<?PHP echo $menu_ls; ?>
</ul>
</div>
</div>
</div>
</body>
</html>
ls.php
<?PHP
include "./inc_menu.php";
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>RELATION.CO.KR_5_275</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>
<link rel="stylesheet" type="text/css" href="./css.css">
<script>
$(document).ready(function(){
//alert('ready');
let p_tab = urlParam('tab');
menue_on(p_tab);
//console.log("padameters",p_tab );
//let menu_cell_w = $(".menu_box > ul > li").outerWidth();
//console.log ("menu_cell_w", menu_cell_w);
let menu_cell_w = 100;
let lef_move = ( p_tab-1 )* menu_cell_w;
console.log ("lef_move", lef_move);
$(".menu_area").scrollLeft( lef_move );
creat_array(p_tab);
});
//파라미터 함수 google 검색
function urlParam(name)
{
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
if (!urlParams.has(name)) { return false; }
return urlParams.get(name);
}
function menue_on(num)
{
let index_num = num -1;
let class_val = $(".menu_area > .menu_box > ul > li").eq(index_num).find(".off").addClass('on');
console.log("class_val", class_val);
}
function creat_array(cate_gbn)
{
var array_ls = [];
array_ls.push({ h:"1. [나이키] 한정판 슈즈 8종", tit:"한정판 슈즈 8종", txt:"nike_1.jpg" }); //index0
array_ls.push({ h:"2. [가민] Forerunner 245 Music", tit:"lForerunner 245 Music", txt:"garmin_1.jpg" });
array_ls.push({ h:"3. [삼성전자] 갤럭시워치4 클래식 42mm", tit:"갤럭시워치4 클래식 42mm", txt:"watch_1.jpg" });
array_ls.push({ h:"4. [LG전자] 프라엘 에센셜 부스터", tit:"프라엘 에센셜 부스터", txt:"pral_1.jpg" });
array_ls.push({ h:"5. [LG전자] 룸앤 스마트 TV", tit:"룸앤 스마트 TV", txt:"room_1.jpg" });
array_ls.push({ h:"6. [LG전자] 퓨리케어 자연기화 가습기", tit:"퓨리케어 자연기화 가습기", txt:"puricare_1.jpg" });
array_ls.push({ h:"7. [벨레] 멜로우(Mellow) 스피커", tit:"멜로우(Mellow) 스피커", txt:"mellow_1.jpg" });
array_ls.push({ h:"8. [카카오프렌즈] 미니 냉장고(80L)", tit:"미니 냉장고(80L)", txt:"kakao_1.jpg" });
array_ls.push({ h:"9. [삼성전자] BESPOKE 큐커", tit:"BESPOKE 큐커", txt:"bespoke_1.jpg" });
array_ls.push({ h:"10. [일리] 커피머신 X7.1", tit:"커피머신 X7.1", txt:"illy_1.jpg" });
array_ls.push({ h:"11. [일리] 커피머신 X10.1", tit:"커피머신 X10.1", txt:"illy_1.jpg" });
//var cate_gbn = getParameterByName('gbn');
//console.log( cate_gbn );
if( cate_gbn == "1" )
{
array_cate_ls = [0,1,2,3,4,5,6,7,8,9,10];
}
else if( cate_gbn == "2")
{
array_cate_ls = [1,2,0];
}
else if( cate_gbn == "3")
{
array_cate_ls = [2,0,1];
}
else if( cate_gbn == "4")
{
array_cate_ls = [3,2,1];
}
else if( cate_gbn == "5")
{
array_cate_ls = [4,2,3];
}
else if( cate_gbn == "6")
{
array_cate_ls = [5,4,3];
}
else if( cate_gbn == "7")
{
array_cate_ls = [6,4,3,10];
}
else if( cate_gbn == "8")
{
array_cate_ls = [7,4,3];
}
else if( cate_gbn == "9")
{
array_cate_ls = [8,4,3];
}
else if( cate_gbn == "10")
{
array_cate_ls = [9,4,3,10];
}
else
{
array_cate_ls = [0,1,2,3,4,5,6,7,8,9,10];
}
var total_array = array_cate_ls.length;
console.log( total_array );
var add_ls = "";
for(var i=0; i<total_array; i++ )
{
add_ls += "<div class='ls_box'><div class='ls'>";
add_ls += "<h2>"+array_ls[array_cate_ls[i]]['h']+"</h2>";
add_ls += "<div class='ls_text'>"+array_ls[array_cate_ls[i]]['tit']+"</div>";
add_ls += "<div class='ls_text'>"+array_ls[array_cate_ls[i]]['txt']+"</div>";
add_ls += "</div></div>";
}
$("#content_area").html(add_ls);
}
</script>
</head>
<body>
<div class="wrap">
<div class="path"><a href="./index.php">INDEX</a></div>
<div class="menu_area">
<div class="menu_box">
<ul>
<?PHP echo $menu_ls; ?>
</ul>
</div>
</div>
<div class="content_area" id="content_area"></div>
</div>
</body>
</html>
