我建立了一个可以使用onclick="jquery()"
这是我的确切脚本：
<img src="images/header_type1.png"
onclick="jQuery('.xe-clearfix').addClass('header_type_1',200),
jQuery('.xe-clearfix').removeClass('header_type_2 header_type_3 header_type_4 header_type_5',200),
jQuery('.fixed_header .header_wrap').addClass('header_type_1',200),
jQuery('.fixed_header .header_wrap').removeClass('header_type_2 header_type_3 header_type_4 header_type_5',200),
jQuery('.gnb>ul>li').addClass('header_type_1',200),
jQuery('.gnb>ul>li').removeClass('header_type_2 header_type_3 header_type_4',200),
jQuery('#gnb .active_li').addClass('header_type_1',200),
jQuery('#gnb .active_li').removeClass('header_type_2 header_type_3 header_type_4 header_type_5',200),
jQuery('.gnb>ul>li:last-child').addClass('header_type_1',200),
jQuery('.gnb>ul>li:last-child').removeClass('header_type_2 header_type_3 header_type_4 header_type_5',200),
jQuery('.gnb>ul>li>a').addClass('header_type_1',200),
jQuery('.gnb>ul>li>a').removeClass('header_type_2 header_type_3 header_type_4 header_type_5',200),
jQuery('#gnb .active').addClass('header_type_1',200),
jQuery('#gnb .active').removeClass('header_type_2 header_type_3 header_type_4 header_type_5',200),
jQuery('.logo_text').addClass('header_type_1',200),
jQuery('.logo_text').removeClass('header_type_2 header_type_3 header_type_4 header_type_5',200),
jQuery('.gnb').addClass('header_type_1',200),
jQuery('.gnb').removeClass('header_type_2 header_type_3 header_type_4 header_type_5',200),
jQuery('.header').addClass('header_type_1',200),
jQuery('.header').removeClass('header_type_2 header_type_3 header_type_4 header_type_5',200),
jQuery('.logo-item').addClass('header_type_1',200),
jQuery('.logo-item').removeClass('header_type_2 header_type_3 header_type_4 header_type_5',200)">
<img src="images/header_type2.png"
onclick="jQuery('.xe-clearfix').addClass('header_type_2',200),
jQuery('.xe-clearfix').removeClass('header_type_1 header_type_3 header_type_4 header_type_5',200),
jQuery('.fixed_header .header_wrap').addClass('header_type_2',200),
jQuery('.fixed_header .header_wrap').removeClass('header_type_1 header_type_3 header_type_4 header_type_5',200),
jQuery('.gnb>ul>li').addClass('header_type_2',200),
jQuery('.gnb>ul>li').removeClass('header_type_1 header_type_3 header_type_4 header_type_5',200),
jQuery('#gnb .active_li').addClass('header_type_2',200),
jQuery('#gnb .active_li').removeClass('header_type_1 header_type_3 header_type_4 header_type_5',200),
jQuery('.gnb>ul>li:last-child').addClass('header_type_2',200),
jQuery('.gnb>ul>li:last-child').removeClass('header_type_1 header_type_3 header_type_4 header_type_5',200),
jQuery('.gnb>ul>li>a').addClass('header_type_2',200),
jQuery('.gnb>ul>li>a').removeClass('header_type_1 header_type_3 header_type_4 header_type_5',200),
jQuery('#gnb .active').addClass('header_type_2',200),
jQuery('#gnb .active').removeClass('header_type_1 header_type_3 header_type_4 header_type_5',200),
jQuery('.logo_text').addClass('header_type_2',200),
jQuery('.logo_text').removeClass('header_type_1 header_type_3 header_type_4 header_type_5',200),
jQuery('.gnb').addClass('header_type_2',200),
jQuery('.gnb').removeClass('header_type_1 header_type3 header_type_4 header_type_5',200),
jQuery('.header').addClass('header_type_2',200),
jQuery('.header').removeClass('header_type_1 header_type_3 header_type_4 header_type_5',200),
jQuery('.logo-item').addClass('header_type_2',200),
jQuery('.logo-item').removeClass('header_type_1 header_type_3 header_type_4 header_type_5',200)
">
<img src="images/header_type3.png"
onclick="
jQuery('.xe-clearfix').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200),
jQuery('.xe-clearfix').addClass('header_type_3',200),
jQuery('.fixed_header .header_wrap').addClass('header_type_3',200),
jQuery('.fixed_header .header_wrap').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200),
jQuery('.gnb>ul>li').addClass('header_type_3',200),
jQuery('.gnb>ul>li').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200),
jQuery('#gnb .active_li').addClass('header_type_3',200),
jQuery('#gnb .active_li').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200),
jQuery('.gnb>ul>li:last-child').addClass('header_type_3',200),
jQuery('.gnb>ul>li:last-child').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200),
jQuery('.gnb>ul>li>a').addClass('header_type_3',200),
jQuery('.gnb>ul>li>a').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200),
jQuery('#gnb .active').addClass('header_type_3',200),
jQuery('#gnb .active').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200),
jQuery('.logo_text').addClass('header_type_3',200),
jQuery('.logo_text').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200),
jQuery('.gnb').addClass('header_type_3',200),
jQuery('.gnb').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200),
jQuery('.header').addClass('header_type_3',200),
jQuery('.header').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200),
jQuery('.logo-item').addClass('header_type_3',200),
jQuery('.logo-item').removeClass('header_type_1 header_type_2 header_type_4 header_type_5',200)" width="100px">
<img src="images/header_type4.png"
onclick="jQuery('.xe-clearfix').addClass('header_type_4',200),
jQuery('.xe-clearfix').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200),
jQuery('.fixed_header .header_wrap').addClass('header_type_4',200),
jQuery('.fixed_header .header_wrap').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200),
jQuery('.gnb>ul>li').addClass('header_type_4',200),
jQuery('.gnb>ul>li').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200),
jQuery('#gnb .active_li').addClass('header_type_4',200),
jQuery('#gnb .active_li').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200),
jQuery('.gnb>ul>li:last-child').addClass('header_type_4',200),
jQuery('.gnb>ul>li:last-child').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200),
jQuery('.gnb>ul>li>a').addClass('header_type_4',200),
jQuery('.gnb>ul>li>a').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200),
jQuery('#gnb .active').addClass('header_type_4',200),
jQuery('#gnb .active').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200),
jQuery('.logo_text').addClass('header_type_4',200),
jQuery('.logo_text').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200),
jQuery('.gnb').addClass('header_type_4',200),
jQuery('.gnb').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200),
jQuery('.header').addClass('header_type_4',200),
jQuery('.header').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200),
jQuery('.logo-item').addClass('header_type_4',200),
jQuery('.logo-item').removeClass('header_type_1 header_type_2 header_type_3 header_type_5',200)" width="100px">
</div>
<div class="item">
<img src="images/header_type5.png"
onclick="jQuery('.xe-clearfix').addClass('header_type_5',200),
jQuery('.xe-clearfix').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200),
jQuery('.fixed_header .header_wrap').addClass('header_type_5',200),
jQuery('.fixed_header .header_wrap').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200),
jQuery('.gnb>ul>li').addClass('header_type_5',200),
jQuery('.gnb>ul>li').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200),
jQuery('#gnb .active_li').addClass('header_type_5',200),
jQuery('#gnb .active_li').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200),
jQuery('.gnb>ul>li:last-child').addClass('header_type_5',200),
jQuery('.gnb>ul>li:last-child').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200),
jQuery('.gnb>ul>li>a').addClass('header_type_5',200),
jQuery('.gnb>ul>li>a').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200),
jQuery('#gnb .active').addClass('header_type_5',200),
jQuery('#gnb .active').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200),
jQuery('.logo_text').addClass('header_type_5',200),
jQuery('.logo_text').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200),
jQuery('.gnb').addClass('header_type_5',200),
jQuery('.gnb').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200),
jQuery('.header').addClass('header_type_5',200),
jQuery('.header').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200),
jQuery('.logo-item').addClass('header_type_5',200),
jQuery('.logo-item').removeClass('header_type_1 header_type_2 header_type_3 header_type_4',200)
" width="100px">
</div>
<div class="item"><img src="images/slider_header_1.png"></div>
</div>
<bar></bar><div class="panel_text">MENU</div>
<div><!-- TABS !-->
<div class="tabs_1">
<ul class="tab-links_1">
<li class="active_1">
<a class="button_left" href="#tab1" onclick="jQuery('.header').addClass('text_type_1',200), jQuery('.header').removeClass('text_type_2',200)">일반</a></li>
<li><a class="button_right" href="#tab2" onclick="jQuery('.header').addClass('text_type_2',200),
jQuery('.header').removeClass('text_type_1',200)">확장</a></li></ul></div>
<!-- TABS !-->
<div class="tabs_2">
<ul class="tab-links_2">
<li class="active_2">
<a class="button_1" onclick="jQuery('#gnb .active').addClass('menu_style_1',200), jQuery('#gnb .active').removeClass('menu_style_2 menu_style_3',200)">없음</a></li>
<li><a class="button_2" onclick="jQuery('#gnb .active').addClass('menu_style_2',200),
jQuery('#gnb .active').removeClass('menu_style_1 menu_style_3',200)">스타일 1</a></li>
<li><a class="button_3" onclick="jQuery('#gnb .active').addClass('menu_style_3',200),
jQuery('#gnb .active').removeClass('menu_style_1 menu_style_2',200)">스타일 2</a></li>
</ul></div><br>
<bar></bar><div class="panel_text">STYLE PACK</div>
<div>
<!-- TABS !-->
<div class="tabs_1">
<ul class="tab-links_1">
<li class="active_1">
<a class="button_left" href="#tab1" onclick="jQuery('.header').addClass('text_type_1',200), jQuery('.header').removeClass('text_type_2',200)">일반</a></li>
<li><a class="button_right" href="#tab2" onclick="jQuery('.header').addClass('text_type_2',200),
jQuery('.header').removeClass('text_type_1',200)">확장</a></li></ul></div>
<!--
<br>
<button onclick="jQuery('.gnb>ul>li').addClass('menu_type_1',200),
jQuery('.gnb>ul>li').removeClass('menu_type_2',200),
jQuery('.#gnb .active_li').addClass('menu_type_1',200),
jQuery('.#gnb .active_li').removeClass('menu_type_2',200)
jQuery('.gnb>ul>li:last-childe').addClass('menu_type_1',200),
jQuery('.gnb>ul>li:last-child').removeClass('menu_type_2',200)"></button>
!-->
<br><br>
<!--<button onclick="
jQuery('.fluid_container').addClass('layout_type_2',200),
jQuery('.camera_target').addClass('layout_type_2',200),
jQuery('.cameraCont, .cameraContents').addClass('layout_type_2',200)"></button>!-->
<!--
jQuery('.gnb>ul>li>a').css('color','#fff'),
jQuery('.logo_text').css('color','#fff'),
jQuery('.shrink .gnb>ul>li>a').css('color','#333'),
jQuery('.shrink .logo_text').css('color','#333')">!-->
<!--
<label for="select"></label>
<select name="select" id="select" class="select">
<option value="on" onclick="jQuery('.fluid_container').css('display','block')">on</option>
<option value="off"
onclick="jQuery('.fluid_container').css('display','none')">off</option>
</select> !-->
<center>
<!--
<input type="range" id="slider_menu_width" min="70" max="100">!-->
<div class="switch">
<input id="cmn-toggle-1" class="cmn-toggle cmn-toggle-round" type="checkbox" checked>
<label for="cmn-toggle-1"></label>
</div>
如您所见，有图像，标签按钮，滑块，切换按钮。 并且会有复选框和下拉字段。
本网站的基本功能是查看网站样式如何随jquery函数addClass()而变化，就像任何其他wordpress演示网站一样。
问题是，当访问者点击其他元素时，结果将被重置，如菜单链接等。
有没有办法可以使用jquery cookies或php cookies保存这些信息？
我并不是说在人们删除浏览器cookie之前它应该永远记住它。它应该足够，直到浏览器关闭。
以下是我网站的链接：http://lifeto.cafe24.com/xe/today#
答案 0 :(得分：0)
你的代码很乱。因为它无效。无论如何，对于您的解决方案，最好使用localStorage。
if (localStorage != null)
localStorage.set("item", "value");
另外，为了解决问题，请使用不引人注目的JavaScript。而不是：
onclick="some_javascript_code_here" id="element"
请考虑：
$("#element").click(function () {
some_javascript_code_here
});
来自评论：
localStorage和sessionStorage都延伸Storage。没有 除了预期的“非持久性”之外，它们之间存在差异sessionStorage。也就是说，
localStorage中存储的数据会一直存在，直到明确存在 删除。所做的更改将保存并可用于所有当前和 未来访问该网站。对于
sessionStorage，更改仅适用于每个窗口（或标签中） 浏览器，如Chrome和Firefox）。所做的更改已保存 可用于当前页面，以及将来访问该站点 在同一窗口。窗口关闭后，存储将被删除。
从另一个答案得到了上述内容：HTML5 Local storage vs. Session storage。
答案 1 :(得分：0)
你回答了自己的问题。
只需使用cookie，您需要存储一些值，每次用户加载页面时，您都需要一段代码来管理cookie的内容“意味着什么”。
例如：
Cookie值：menu_tab = 1
//get the cookie value
if(menu_tab == 1)
jQuery("menu-tab").addClass("red");
else
jQuery("menu-tab").addClass("invisible");