제이쿼리 코드를 짧게 하고 싶은데...
본문
제이쿼리 코드를 짧게 하고 싶은데
이렇게 밖에 표현을 못하겠네요;;;
혹시 이거 짧게 쓸 수 있나요? ㅠ ㅠ
function get_strage2013() {
localStorage.tab_flg = "tab_2013";
var data_tab = localStorage.tab_flg;
}
function get_strage2012() {
localStorage.tab_flg = "tab_2012";
var data_tab = localStorage.tab_flg;
}
function get_strage2011() {
localStorage.tab_flg = "tab_2011";
var data_tab = localStorage.tab_flg;
}
function get_strage2010() {
localStorage.tab_flg = "tab_2010";
var data_tab = localStorage.tab_flg;
}
function get_strage2009() {
localStorage.tab_flg = "tab_2009";
var data_tab = localStorage.tab_flg;
}
function get_strage2008() {
localStorage.tab_flg = "tab_2008";
var data_tab = localStorage.tab_flg;
}
function get_strage2007() {
localStorage.tab_flg = "tab_2007";
var data_tab = localStorage.tab_flg;
}
window.onload = function(){
var data_tab = localStorage.tab_flg;
if ( data_tab === "tab_2013" ){
var num = $("#tab li").index(this);
derete_boxstyle();
$(".content_wrap").eq(0).removeClass('disnon');
$("#tab li:eq(0)").addClass('select')
} else if ( data_tab === "tab_2012" ){
var num = $("#tab li").index(this);
derete_boxstyle();
$(".content_wrap").eq(1).removeClass('disnon');
$("#tab li:eq(1)").addClass('select')
} else if ( data_tab === "tab_2011" ){
var num = $("#tab li").index(this);
derete_boxstyle();
$(".content_wrap").eq(2).removeClass('disnon');
$("#tab li:eq(2)").addClass('select')
} else if ( data_tab === "tab_2010" ){
var num = $("#tab li").index(this);
derete_boxstyle();
$(".content_wrap").eq(3).removeClass('disnon');
$("#tab li:eq(3)").addClass('select')
} else if ( data_tab === "tab_2009" ){
var num = $("#tab li").index(this);
derete_boxstyle();
$(".content_wrap").eq(4).removeClass('disnon');
$("#tab li:eq(4)").addClass('select')
} else if ( data_tab === "tab_2008" ){
var num = $("#tab li").index(this);
derete_boxstyle();
$(".content_wrap").eq(5).removeClass('disnon');
$("#tab li:eq(5)").addClass('select')
} else if ( data_tab === "tab_2007" ){
var num = $("#tab li").index(this);
derete_boxstyle();
$(".content_wrap").eq(6).removeClass('disnon');
$("#tab li:eq(6)").addClass('select')
}
localStorage.removeItem("tab_flg");
}
function derete_boxstyle() {
$(".content_wrap").addClass('disnon');
$("#tab li").removeClass('select');
}
답변 1
위에 get_strage20~~() 이 함수들은 어떤 걸 클릭하나요?
실제 클릭하는 부분이 코드가 어떻게 되어 있는지요?
html코드를 말씀하시는건가요?
<ul id="tab" class="pagelink">
<li class="select firstchild">2013年</li>
<li>2012年</li>
<li>2011年</li>
<li>2010年</li>
<li>2009年</li>
<li>2008年</li>
<li class="lastchild">2007年</li>
</ul>
요런 탭메뉴에 각 탭 안에 년도별 내용이 있습니다.
window.onload = function(){
var data_tab = localStorage.tab_flg;
var tabs = new Array("2013", "2012", "2011", "2010", "2009", "2008", "2007");
for(i=0; i<tabs.length; i++) {
if(data_tab === "tab_" + tabs[i]) {
var num = $("#tab li").index(this);
derete_boxstyle();
$(".content_wrap").eq(i).removeClass('disnon');
$("#tab li:eq(" + i + ")").addClass('select');
}
}
localStorage.removeItem("tab_flg");
}
window.onload 부분은 이렇게 줄인다고 하지만 function get_strage~~` 이건 어떤 걸 클릭하는지 알 수가 없어서 못 줄이겠네요.
분명 어떤 부분을 클릭하거나 실행하기 위해서 저 함수를 만드신 거 같은데...
위에 function으로 만드신 함수는 어떠한 경우에 호출이 되는 건가요?
왕계란님 답변 감사드립니다 ~^^
글로 설명이 잘 될지 모르겠는데...
저런 코드를 쓴 이유는
일단 TOP페이지에 a페이지로 이동하는 배너를 달았는데,
배너는 연도별로 되어있습니다.
a페이지는 각 연도별 내용이 탭메뉴로 되어있어,
2014 | 2013 | 2014 | 2015 | 2010 요런식으로...
a페이지는 요런 탭 메뉴에 클릭한 연도만 보여지게 됩니다.
물론 첫 페이지는 2014년으로 설정이 되어있습니다.
요런 설명으로 가능할런지.. 아니면 html내용이 있어야 되는건가요? ㅠ ㅠ
지난 번에도 html 페이지 보여 달랬다가 거절 당했지요. ㅎㅎ
단순히 스크립트만 보는 것보다 저 코드들이 실제로 작동하는 페이지를 보여 주시는 게 좋지요.
어디 발설하고 안 그럽니다.
쪽지로 주소 보내 주시면 제가 보고 답변을...쿨럭;
아고 죄송해요 ㅋㅋ
지난번에는 잠금걸린 사이트여서 그랬고.. ㅎㅎ
이번건 쪽지로 보내드렸습니다 ... 알려주세용 >_ < 제가 자바스크립트를 전혀 이해하지 못하고 있어서 ㅡㅡ;
