如何在jquery中的主题之间切换？
如何在jquery中的主题之间切换？
提问于 2014-06-24 06:23:27
这是我的下拉菜单，包含主题名称列表。
boot.html
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Switch Theme<b class="caret"></b></a>
<ul class="dropdown-menu">
<li> <a>Dark</a> </li>
<li> <a>Apple</a> </li>
<li> <a>Blue</a> </li>
<li> <a>Pearl</a> </li>
<li> <a>Box</a> </li>
<li> <a>Pane</a> </li>
<li> <a>glue</a> </li>
<li> <a>Gun</a> </li>
<li> <a>Interim</a> </li>
<li> <a>Squash</a> </li>
</ul>
</li>如果我点击它们，我需要链接标签指向不同的css文件。我已经找到了使链接标记指向单个css路径的解决方案，在通常情况下，任何列表项都被单击。但是我想要不同的列表指出不同的css路径。
我为不同的主题提供了链接标记路径，例如
cssa/jquery-ui-1.10.4.custom.min.css
cssb/jquery-ui-1.10.4.custom.min.css
cssc/jquery-ui-1.10.4.custom.min.css
cssd/jquery-ui-1.10.4.custom.min.css
csse/jquery-ui-1.10.4.custom.min.css
cssf/jquery-ui-1.10.4.custom.min.css以下是指向单击列表项的路径的jquery解决方案：
<script>
var link = $('link.me');
$(window).load(function () {
var link = $('link.me');
var list= $('ul.dropdown-menu li');
list.click(function (e) {
e.preventDefault();
link.attr('href', 'cssh/jquery-ui-1.10.4.custom.min.css')
});
});
</script>我要做两件事
他说:我希望每个列表都指出不同的路径。我怎样才能实现它。
2:刷新后，页面必须坚持选定的主题。
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-06-24 06:30:21
试试这边
HTML
<li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">Switch Theme<b class="caret"></b></a>
<ul class="dropdown-menu">
<li> <a data-theme="cssa/jquery-ui-1.10.4.custom.min.css">Dark</a>
</li>
<li> <a data-theme="csse/jquery-ui-1.10.4.custom.min.css">Apple</a>
</li>
<li> <a data-theme="cssb/jquery-ui-1.10.4.custom.min.css">Blue</a>
</li>
<li> <a data-theme="cssc/jquery-ui-1.10.4.custom.min.css">Pearl</a>
</li>
<li> <a data-theme="cssd/jquery-ui-1.10.4.custom.min.css">Box</a>
</li>
</ul>
</li>脚本
$(window).load(function () {
var link = $('link.me');
$('ul.dropdown-menu li').click(function (e) {
e.preventDefault();
var theme = $(this).find('a').data('theme');
var store = $(this).index();
localStorage.setItem("colors", store);
link.attr('href', theme)
});
var retrievedObject = localStorage.getItem('colors');
if (retrievedObject != null) {
$('ul.dropdown-menu li:eq(' + retrievedObject + ')').trigger('click');
} else {
$('ul.dropdown-menu li:eq(0)').click();
}
});演示
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/24379659
复制相关文章
相似问题
腾讯云开发者
