我一直在尝试这种方式,我无法弄清楚这里有什么问题。
这是我的代码
http://jsbin.com/xeroborohe/edit?html,output
这就是我链接我的css的方式
<link rel='stylesheet" type="text/css" href="https://aa4d96bd21c195e7b862b851b0818e89fb8ee102.googledrive.com/host/0B77cxO0Vjbb2MlYyUFpmVXhTUWc/knowledgetree.css" />
由于某些原因,链接到Google云端硬盘存储样式表的行无效。我也尝试在我的驱动器上本地链接文件..没有运气
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script type="text/javascript">
window.toggleDiv = function(divId) {
var ele = document.getElementById(divId);
var state=jQuery(ele).is(':visible');
jQuery(ele).toggle();
state=jQuery(ele).is(':visible');
localStorage.setItem( divId, state);
}
</script>
<script type="text/javascript">
(function($){
$( document ).ready(function() {
$(".collapsible").each(function(index) {
if (typeof($(this).attr('id'))!="undefined") {
id=$(this).attr('id');
var state = localStorage.getItem(id);
ele = document.getElementById(id);
if (state=="true") {
ele.style.display = 'block' ;}
else {
ele.style.display = 'none'; }
}
});
});
})(jQuery)
</script>
<link rel="stylesheet" type="text/css" href="https://aa4d96bd21c195e7b862b851b0818e89fb8ee102.googledrive.com/host/0B77cxO0Vjbb2MlYyUFpmVXhTUWc/knowledgetree.css" />
<a class="ConceptLevel1" href="javascript:toggleDiv('PktS/h+L5EeSqM/4hMH9JA==');" style="font-
size:13pt">Root</a><br>
<div class="collapsible" style="display:none " id="PktS/h+L5EeSqM/4hMH9JA==">
<a class="ConceptLevel2" href="javascript:toggleDiv('KlHtq+Xe60essn+0zs9E6g==');" style="font-
size:12pt">level 1</a><br>
<div class="collapsible" style="" id="KlHtq+Xe60essn+0zs9E6g==">
<div>Level 2</div>
<a class="ConceptLevel3" href="javascript:toggleDiv('EdMUp+28okWIWHVbvUaU1g==');" style="font-
size:11pt">Level 2</a><br>
<div class="collapsible" style="" id="EdMUp+28okWIWHVbvUaU1g==">
<a class="ConceptLevel4" href="javascript:toggleDiv('wIZCSCx/Xk2YShMAkF33Pg==');"
style="font-size:10pt">Level 3</a><br>
<div class="collapsible" style="" id="wIZCSCx/Xk2YShMAkF33Pg==">
<div>Level 4</div>
<a class="ConceptLevel5" href="javascript:toggleDiv('7GKbN5XRqkybT
+XsbHkyqw==');" style="font-size:9pt">Level 4</a><br>
<div class="collapsible" style="" id="7GKbN5XRqkybT+XsbHkyqw==">
<div>Level 5</div>
<a class="ConceptLevel6" href="javascript:toggleDiv
('rV75pTUXp0KP6Mx6EJznDg==');" style="font-size:8pt">Level 5</a><br>
<div class="collapsible" style="display:none "
id="rV75pTUXp0KP6Mx6EJznDg==">
<div class="details">Conclusion: for all the below levels ....</div>
<a class="ConceptLevel7" href="javascript:toggleDiv
('a5qCUDoqI0CPlS4pPGcODQ==');" style="font-size:7pt">Level 6</a><br>
<div class="collapsible" style=""
id="a5qCUDoqI0CPlS4pPGcODQ==">
<div>Level 7</div>
<div>Level 7</div>
</div>
<div>Level 6</div>
</div>
</div>
</div>
<div>Level 3</div>
</div>
</div>
</div>
更新:我已经修复了链接,现在它导致了一个css文件https://aa4d96bd21c195e7b862b851b0818e89fb8ee102.googledrive.com/host/0B77cxO0Vjbb2MlYyUFpmVXhTUWc/knowledgetree.css
答案 0 :(得分:0)
你的html标签中的第一个属性(你用css链接的那个)中有一个单引号后跟双引号。
请密切注意语法着色。 Stackoverflow已经做到了这一点。 尝试使用IDE(“集成开发环境”或代码辅助文本编辑器),如Notepad ++,Atom,Sublime Text 3等。 谷歌“十大理想”。
祝你好运。答案 1 :(得分:0)
这很令人尴尬,主要是因为我(夜间的程序员),但对于那些急于批准我的错别字或者他们认为这会是错别字的专业人士来说应该更多。
我在hss代码中使用ConceptLevel,在css中使用conceptlevel 我想知道为什么jsbin使用这个