Commit @7064f1023d4f134ccea58378350628fe4cd9d8fb

정수빈 8 hours ago

서브메뉴 수정

@7064f1023d4f134ccea58378350628fe4cd9d8fb

851a805

7064f10

src/main/webapp/publish/usr/script/submenu.js

--- src/main/webapp/publish/usr/script/submenu.js

+++ src/main/webapp/publish/usr/script/submenu.js


-$(function(){
-	console.log('??!!???');
-	
-	const currentPath = window.location.pathname;
-	console.log(currentPath);
-
-	if (currentPath !== '/web/main/mainPage.do') {
-		if (currentPath === '/web/content.do') {
-			fn_getSubMenu();
-		}
-	}
-	
-	$(document).on("click", ".snb_title", function() {
-	    const $wrap = $(this).closest(".snb_wrap");
-
-	    // 다른 열려있는 메뉴 닫기
-	    $(".snb_wrap").not($wrap)
-	      .removeClass("active")
-	      .find(".snb_select").slideUp(200);
-
-	    // 클릭한 메뉴 토글
-	    $wrap.toggleClass("active")
-	      .find(".snb_select").stop(true, true).slideToggle(250);
-	});
-
-	$(document).on("click", function (e) {
-	    if (!$(e.target).closest(".snb_wrap").length) {
-	        $(".snb_wrap")
-	            .removeClass("active")
-	            .find(".snb_select")
-	            .slideUp(200);
-	    }
-	});
-	
-	
-});
-
-function fn_getSubMenu(){
-	
-	var title = $('#container .sub_title').text();
-	var subTitle;
-	var depth3Title = $.trim($('.content_title').text());
-	
-	$(".header_container .depth03").each(function(idx, itm){
-	    let text = $.trim($(itm).text());
-	    
-	    if(depth3Title === text){
-	        subTitle = $(itm).closest(".depth03_ul").siblings(".depth02").text();
-	        subTitle = $.trim(subTitle);
-	        return false;
-	    }else{
-	    	subTitle = depth3Title;
-	    }
-	});
-	
-
-	var sendData = {
-			"depth1MenuNm" :  title,
-			"depth2MenuNm" : subTitle,
-			"depth3MenuNm" : depth3Title
-		}
-	
-	console.log('title ::', title);
-	console.log('subTitle ::', subTitle);
-	console.log('depth3Title ::', depth3Title);
-	
-	$.ajax({
-		type: 'POST',
-		url: "/web/com/subMenu.do",
-		contentType: 'application/json',
-		data: JSON.stringify(sendData),
-		dataType: 'json',
-		success: function(data) {
-			console.log(data);
-			if(data.status == 'OK'){
-				renderSubVisualNav(data);	
-			}
-		},
-		error: function(err) {
-			console.error(err);
-		}
-	});
-	
-		
-	setTimeout(function(){
-    	$(".snb_select li a").each(function(idx,itm){
-    		$(".header_container .gnb a").each(function(index,item){
-    			var itemUrl = $(item).attr("href");
-    			if($(itm).text().trim() == $(item).text().trim()){
-    				$(itm).attr("href",itemUrl);
-    			}
-    		})
-    	})
-    },1000)
-}
-
-
-// AJAX 성공 시 호출되는 함수 내부
-function renderSubVisualNav(res) {
-    const result = res.data || res; // res.data가 있으면 쓰고, 없으면 res 자체를 사용
-    
-    const depth1List = result.depth1List || []; // 데이터가 없으면 빈 배열로 초기화
-    const depth2List = result.depth2List || [];
-    const depth3List = result.depth3List || [];
-    const selected1 = result.selectedDepth1;
-    const selected2 = result.selectedDepth2;
-    const selected3 = result.selectedDepth3;
-
-    let html = '';
-
-    // 1. 기본 홈 아이콘
-    html += '<a href="/"><i class="icon home"></i></a>';
-
-    // 2. 1Depth 메뉴 생성
-    if (depth1List.length > 0) { // 리스트가 있을 때만 실행
-        html += '<div class="snb_wrap">';
-        html += `  <button type="button" class="snb_title">${selected1 ? selected1.text : '메뉴'}</button>`;
-        html += '  <ul class="snb_select">';
-        depth1List.forEach(item => {
-            html += `    <li><a href="${item.url || '#'}">${item.text}</a></li>`;
-        });
-        html += '  </ul>';
-        html += '</div>';
-    }
-
-    // 3. 2Depth 메뉴 생성
-    if (depth2List.length > 0) {
-        html += '<div class="snb_wrap">';
-        html += `  <button type="button" class="snb_title">${selected2 ? selected2.text : '메뉴'}</button>`;
-        html += '  <ul class="snb_select">';
-        depth2List.forEach(item => {
-            html += `    <li><a href="${item.url || '#'}">${item.text}</a></li>`;
-        });
-        html += '  </ul>';
-        html += '</div>';
-    }
-    
-    if (depth3List.length > 0) {
-        html += '<div class="snb_wrap snb_depth03">';
-        html += `  <button type="button" class="snb_title">${selected3 ? selected3.text : '메뉴'}</button>`;
-        html += '  <ul class="snb_select">';
-        depth3List.forEach(item => {
-            html += `    <li><a href="${item.url || '#'}">${item.text}</a></li>`;
-        });
-        html += '  </ul>';
-        html += '</div>';
-    }
-
-    document.querySelector('.sub_visual_nav').innerHTML = html;
-    
-}
+$(function(){
+	console.log('??!!???');
+	
+	const currentPath = window.location.pathname;
+	console.log(currentPath);
+
+	if (currentPath !== '/web/main/mainPage.do') {
+		if (currentPath === '/web/content.do') {
+			fn_getSubMenu();
+		}
+	}
+	
+	$(document).on("click", ".snb_title", function() {
+	    const $wrap = $(this).closest(".snb_wrap");
+
+	    // 다른 열려있는 메뉴 닫기
+	    $(".snb_wrap").not($wrap)
+	      .removeClass("active")
+	      .find(".snb_select").slideUp(200);
+
+	    // 클릭한 메뉴 토글
+	    $wrap.toggleClass("active")
+	      .find(".snb_select").stop(true, true).slideToggle(250);
+	});
+
+	$(document).on("click", function (e) {
+	    if (!$(e.target).closest(".snb_wrap").length) {
+	        $(".snb_wrap")
+	            .removeClass("active")
+	            .find(".snb_select")
+	            .slideUp(200);
+	    }
+	});
+	
+	
+});
+
+function fn_getSubMenu(){
+	
+	var title = $.trim($('#container .sub_title').text()).replace(/\s+/g, ' ');;
+	var subTitle;
+	var depth3Title = $.trim($('.content_title').text()).replace(/\s+/g, ' ');
+	
+	$(".header_container .depth03").each(function(idx, itm){
+	    let text = $.trim($(itm).text()).replace(/\s+/g, ' ');
+	    
+	    if(depth3Title === text){
+	        subTitle = $(itm).closest(".depth03_ul").siblings(".depth02").text();
+	        subTitle = $.trim(subTitle).replace(/\s+/g, ' ');
+	        return false;
+	    }else{
+	    	subTitle = depth3Title;
+	    }
+	});
+	
+
+	var sendData = {
+			"depth1MenuNm" :  title,
+			"depth2MenuNm" : subTitle,
+			"depth3MenuNm" : depth3Title
+		}
+	
+	console.log('title ::', title);
+	console.log('subTitle ::', subTitle);
+	console.log('depth3Title ::', depth3Title);
+	
+	$.ajax({
+		type: 'POST',
+		url: "/web/com/subMenu.do",
+		contentType: 'application/json',
+		data: JSON.stringify(sendData),
+		dataType: 'json',
+		success: function(data) {
+			console.log(data);
+			if(data.status == 'OK'){
+				renderSubVisualNav(data);	
+			}
+		},
+		error: function(err) {
+			console.error(err);
+		}
+	});
+	
+		
+	setTimeout(function(){
+    	$(".snb_select li a").each(function(idx,itm){
+    		$(".header_container .gnb a").each(function(index,item){
+    			var itemUrl = $(item).attr("href");
+    			if($(itm).text().trim() == $(item).text().trim()){
+    				$(itm).attr("href",itemUrl);
+    			}
+    		})
+    	})
+    },1000)
+}
+
+
+// AJAX 성공 시 호출되는 함수 내부
+function renderSubVisualNav(res) {
+    const result = res.data || res; // res.data가 있으면 쓰고, 없으면 res 자체를 사용
+    
+    const depth1List = result.depth1List || []; // 데이터가 없으면 빈 배열로 초기화
+    const depth2List = result.depth2List || [];
+    const depth3List = result.depth3List || [];
+    const selected1 = result.selectedDepth1;
+    const selected2 = result.selectedDepth2;
+    const selected3 = result.selectedDepth3;
+
+    let html = '';
+
+    // 1. 기본 홈 아이콘
+    html += '<a href="/"><i class="icon home"></i></a>';
+
+    // 2. 1Depth 메뉴 생성
+    if (depth1List.length > 0) { // 리스트가 있을 때만 실행
+        html += '<div class="snb_wrap">';
+        html += `  <button type="button" class="snb_title">${selected1 ? selected1.text : '메뉴'}</button>`;
+        html += '  <ul class="snb_select">';
+        depth1List.forEach(item => {
+            html += `    <li><a href="${item.url || '#'}">${item.text}</a></li>`;
+        });
+        html += '  </ul>';
+        html += '</div>';
+    }
+
+    // 3. 2Depth 메뉴 생성
+    if (depth2List.length > 0) {
+        html += '<div class="snb_wrap">';
+        html += `  <button type="button" class="snb_title">${selected2 ? selected2.text : '메뉴'}</button>`;
+        html += '  <ul class="snb_select">';
+        depth2List.forEach(item => {
+            html += `    <li><a href="${item.url || '#'}">${item.text}</a></li>`;
+        });
+        html += '  </ul>';
+        html += '</div>';
+    }
+    
+    if (depth3List.length > 0) {
+        html += '<div class="snb_wrap snb_depth03">';
+        html += `  <button type="button" class="snb_title">${selected3 ? selected3.text : '메뉴'}</button>`;
+        html += '  <ul class="snb_select">';
+        depth3List.forEach(item => {
+            html += `    <li><a href="${item.url || '#'}">${item.text}</a></li>`;
+        });
+        html += '  </ul>';
+        html += '</div>';
+    }
+
+    document.querySelector('.sub_visual_nav').innerHTML = html;
+    
+}

Add a comment

Open 0
Closed 0

List

...	...	@@ -1,151 +1,151 @@
1		-$(function(){
2		- console.log('??!!???');
3		-
4		- const currentPath = window.location.pathname;
5		- console.log(currentPath);
6		-
7		- if (currentPath !== '/web/main/mainPage.do') {
8		- if (currentPath === '/web/content.do') {
9		- fn_getSubMenu();
10		- }
11		- }
12		-
13		- $(document).on("click", ".snb_title", function() {
14		- const $wrap = $(this).closest(".snb_wrap");
15		-
16		- // 다른 열려있는 메뉴 닫기
17		- $(".snb_wrap").not($wrap)
18		- .removeClass("active")
19		- .find(".snb_select").slideUp(200);
20		-
21		- // 클릭한 메뉴 토글
22		- $wrap.toggleClass("active")
23		- .find(".snb_select").stop(true, true).slideToggle(250);
24		- });
25		-
26		- $(document).on("click", function (e) {
27		- if (!$(e.target).closest(".snb_wrap").length) {
28		- $(".snb_wrap")
29		- .removeClass("active")
30		- .find(".snb_select")
31		- .slideUp(200);
32		- }
33		- });
34		-
35		-
36		-});
37		-
38		-function fn_getSubMenu(){
39		-
40		- var title = $('#container .sub_title').text();
41		- var subTitle;
42		- var depth3Title = $.trim($('.content_title').text());
43		-
44		- $(".header_container .depth03").each(function(idx, itm){
45		- let text = $.trim($(itm).text());
46		-
47		- if(depth3Title === text){
48		- subTitle = $(itm).closest(".depth03_ul").siblings(".depth02").text();
49		- subTitle = $.trim(subTitle);
50		- return false;
51		- }else{
52		- subTitle = depth3Title;
53		- }
54		- });
55		-
56		-
57		- var sendData = {
58		- "depth1MenuNm" : title,
59		- "depth2MenuNm" : subTitle,
60		- "depth3MenuNm" : depth3Title
61		- }
62		-
63		- console.log('title ::', title);
64		- console.log('subTitle ::', subTitle);
65		- console.log('depth3Title ::', depth3Title);
66		-
67		- $.ajax({
68		- type: 'POST',
69		- url: "/web/com/subMenu.do",
70		- contentType: 'application/json',
71		- data: JSON.stringify(sendData),
72		- dataType: 'json',
73		- success: function(data) {
74		- console.log(data);
75		- if(data.status == 'OK'){
76		- renderSubVisualNav(data);
77		- }
78		- },
79		- error: function(err) {
80		- console.error(err);
81		- }
82		- });
83		-
84		-
85		- setTimeout(function(){
86		- $(".snb_select li a").each(function(idx,itm){
87		- $(".header_container .gnb a").each(function(index,item){
88		- var itemUrl = $(item).attr("href");
89		- if($(itm).text().trim() == $(item).text().trim()){
90		- $(itm).attr("href",itemUrl);
91		- }
92		- })
93		- })
94		- },1000)
95		-}
96		-
97		-
98		-// AJAX 성공 시 호출되는 함수 내부
99		-function renderSubVisualNav(res) {
100		- const result = res.data \|\| res; // res.data가 있으면 쓰고, 없으면 res 자체를 사용
101		-
102		- const depth1List = result.depth1List \|\| []; // 데이터가 없으면 빈 배열로 초기화
103		- const depth2List = result.depth2List \|\| [];
104		- const depth3List = result.depth3List \|\| [];
105		- const selected1 = result.selectedDepth1;
106		- const selected2 = result.selectedDepth2;
107		- const selected3 = result.selectedDepth3;
108		-
109		- let html = '';
110		-
111		- // 1. 기본 홈 아이콘
112		- html += '<a href="/"><i class="icon home"></i></a>';
113		-
114		- // 2. 1Depth 메뉴 생성
115		- if (depth1List.length > 0) { // 리스트가 있을 때만 실행
116		- html += '<div class="snb_wrap">';
117		- html += ` <button type="button" class="snb_title">${selected1 ? selected1.text : '메뉴'}</button>`;
118		- html += ' <ul class="snb_select">';
119		- depth1List.forEach(item => {
120		- html += ` <li><a href="${item.url \|\| '#'}">${item.text}</a></li>`;
121		- });
122		- html += ' </ul>';
123		- html += '</div>';
124		- }
125		-
126		- // 3. 2Depth 메뉴 생성
127		- if (depth2List.length > 0) {
128		- html += '<div class="snb_wrap">';
129		- html += ` <button type="button" class="snb_title">${selected2 ? selected2.text : '메뉴'}</button>`;
130		- html += ' <ul class="snb_select">';
131		- depth2List.forEach(item => {
132		- html += ` <li><a href="${item.url \|\| '#'}">${item.text}</a></li>`;
133		- });
134		- html += ' </ul>';
135		- html += '</div>';
136		- }
137		-
138		- if (depth3List.length > 0) {
139		- html += '<div class="snb_wrap snb_depth03">';
140		- html += ` <button type="button" class="snb_title">${selected3 ? selected3.text : '메뉴'}</button>`;
141		- html += ' <ul class="snb_select">';
142		- depth3List.forEach(item => {
143		- html += ` <li><a href="${item.url \|\| '#'}">${item.text}</a></li>`;
144		- });
145		- html += ' </ul>';
146		- html += '</div>';
147		- }
148		-
149		- document.querySelector('.sub_visual_nav').innerHTML = html;
150		-
151		-}
	1	+$(function(){
	2	+ console.log('??!!???');
	3	+
	4	+ const currentPath = window.location.pathname;
	5	+ console.log(currentPath);
	6	+
	7	+ if (currentPath !== '/web/main/mainPage.do') {
	8	+ if (currentPath === '/web/content.do') {
	9	+ fn_getSubMenu();
	10	+ }
	11	+ }
	12	+
	13	+ $(document).on("click", ".snb_title", function() {
	14	+ const $wrap = $(this).closest(".snb_wrap");
	15	+
	16	+ // 다른 열려있는 메뉴 닫기
	17	+ $(".snb_wrap").not($wrap)
	18	+ .removeClass("active")
	19	+ .find(".snb_select").slideUp(200);
	20	+
	21	+ // 클릭한 메뉴 토글
	22	+ $wrap.toggleClass("active")
	23	+ .find(".snb_select").stop(true, true).slideToggle(250);
	24	+ });
	25	+
	26	+ $(document).on("click", function (e) {
	27	+ if (!$(e.target).closest(".snb_wrap").length) {
	28	+ $(".snb_wrap")
	29	+ .removeClass("active")
	30	+ .find(".snb_select")
	31	+ .slideUp(200);
	32	+ }
	33	+ });
	34	+
	35	+
	36	+});
	37	+
	38	+function fn_getSubMenu(){
	39	+
	40	+ var title = $.trim($('#container .sub_title').text()).replace(/\s+/g, ' ');;
	41	+ var subTitle;
	42	+ var depth3Title = $.trim($('.content_title').text()).replace(/\s+/g, ' ');
	43	+
	44	+ $(".header_container .depth03").each(function(idx, itm){
	45	+ let text = $.trim($(itm).text()).replace(/\s+/g, ' ');
	46	+
	47	+ if(depth3Title === text){
	48	+ subTitle = $(itm).closest(".depth03_ul").siblings(".depth02").text();
	49	+ subTitle = $.trim(subTitle).replace(/\s+/g, ' ');
	50	+ return false;
	51	+ }else{
	52	+ subTitle = depth3Title;
	53	+ }
	54	+ });
	55	+
	56	+
	57	+ var sendData = {
	58	+ "depth1MenuNm" : title,
	59	+ "depth2MenuNm" : subTitle,
	60	+ "depth3MenuNm" : depth3Title
	61	+ }
	62	+
	63	+ console.log('title ::', title);
	64	+ console.log('subTitle ::', subTitle);
	65	+ console.log('depth3Title ::', depth3Title);
	66	+
	67	+ $.ajax({
	68	+ type: 'POST',
	69	+ url: "/web/com/subMenu.do",
	70	+ contentType: 'application/json',
	71	+ data: JSON.stringify(sendData),
	72	+ dataType: 'json',
	73	+ success: function(data) {
	74	+ console.log(data);
	75	+ if(data.status == 'OK'){
	76	+ renderSubVisualNav(data);
	77	+ }
	78	+ },
	79	+ error: function(err) {
	80	+ console.error(err);
	81	+ }
	82	+ });
	83	+
	84	+
	85	+ setTimeout(function(){
	86	+ $(".snb_select li a").each(function(idx,itm){
	87	+ $(".header_container .gnb a").each(function(index,item){
	88	+ var itemUrl = $(item).attr("href");
	89	+ if($(itm).text().trim() == $(item).text().trim()){
	90	+ $(itm).attr("href",itemUrl);
	91	+ }
	92	+ })
	93	+ })
	94	+ },1000)
	95	+}
	96	+
	97	+
	98	+// AJAX 성공 시 호출되는 함수 내부
	99	+function renderSubVisualNav(res) {
	100	+ const result = res.data \|\| res; // res.data가 있으면 쓰고, 없으면 res 자체를 사용
	101	+
	102	+ const depth1List = result.depth1List \|\| []; // 데이터가 없으면 빈 배열로 초기화
	103	+ const depth2List = result.depth2List \|\| [];
	104	+ const depth3List = result.depth3List \|\| [];
	105	+ const selected1 = result.selectedDepth1;
	106	+ const selected2 = result.selectedDepth2;
	107	+ const selected3 = result.selectedDepth3;
	108	+
	109	+ let html = '';
	110	+
	111	+ // 1. 기본 홈 아이콘
	112	+ html += '<a href="/"><i class="icon home"></i></a>';
	113	+
	114	+ // 2. 1Depth 메뉴 생성
	115	+ if (depth1List.length > 0) { // 리스트가 있을 때만 실행
	116	+ html += '<div class="snb_wrap">';
	117	+ html += ` <button type="button" class="snb_title">${selected1 ? selected1.text : '메뉴'}</button>`;
	118	+ html += ' <ul class="snb_select">';
	119	+ depth1List.forEach(item => {
	120	+ html += ` <li><a href="${item.url \|\| '#'}">${item.text}</a></li>`;
	121	+ });
	122	+ html += ' </ul>';
	123	+ html += '</div>';
	124	+ }
	125	+
	126	+ // 3. 2Depth 메뉴 생성
	127	+ if (depth2List.length > 0) {
	128	+ html += '<div class="snb_wrap">';
	129	+ html += ` <button type="button" class="snb_title">${selected2 ? selected2.text : '메뉴'}</button>`;
	130	+ html += ' <ul class="snb_select">';
	131	+ depth2List.forEach(item => {
	132	+ html += ` <li><a href="${item.url \|\| '#'}">${item.text}</a></li>`;
	133	+ });
	134	+ html += ' </ul>';
	135	+ html += '</div>';
	136	+ }
	137	+
	138	+ if (depth3List.length > 0) {
	139	+ html += '<div class="snb_wrap snb_depth03">';
	140	+ html += ` <button type="button" class="snb_title">${selected3 ? selected3.text : '메뉴'}</button>`;
	141	+ html += ' <ul class="snb_select">';
	142	+ depth3List.forEach(item => {
	143	+ html += ` <li><a href="${item.url \|\| '#'}">${item.text}</a></li>`;
	144	+ });
	145	+ html += ' </ul>';
	146	+ html += '</div>';
	147	+ }
	148	+
	149	+ document.querySelector('.sub_visual_nav').innerHTML = html;
	150	+
	151	+}

Delete comment