ユーザーはドロップダウンからテーマを選択し、選択したテーマはローカルストレージに保存されます。 localstorageのドロップダウン値を保存することはできますが、スタイルシートを呼び出すことはありません。助けてください、ありがとう!ローカルストレージを使用したドロップダウンCSS
フランデンシュタインのコードタイプを赦免します。 JSは私にとって外国人です。私はデザイナーです。 CSSの作品を変更する
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<link href="style1.css" rel="stylesheet" type="text/css" title="s1" id="s1"/>
</head>
<body>
<select id="mySelect" class="test">
<option value="style1.css">Option A</option>
<option value="style2.css">Option B</option>
<option value="style3.css">Option C</option>
</select>
<!--local storage-->
<script>
$('.test').change(function() {
localStorage.setItem(this.id, this.value);
}).val(function() {
return localStorage.getItem(this.id)
});
</script>
<!--dropdown css-->
<script>
function setStyleSource (linkID, sourceLoc) {
var theLink = document.getElementById(linkID);
theLink.href = sourceLoc;
console.log(theLink.href);
}
document.getElementById("mySelect").addEventListener("change", function(){
var selected = this.options[this.selectedIndex].value;
setStyleSource ("s1", selected)
});
</script>
</body>
</html>
1.ドロップダウン。 2.選択したオプションのローカルストレージ。 保存されている選択されたオプションは実際には独自のCSSシートを表示しません(代わりにデフォルトのCSSを表示しています)。 val()
doesntのトリガーchange
イベントでdropdownvalueを変更
console.logには何が表示されますか? – dgrogan
スタイルシートを変更している唯一のものは、リンクを変更するドロップダウンからの選択です(ページを更新する必要があるかもしれません)。私は間違っているかもしれませんが、ストレージの呼び出しは何もしていないように見えます。 – wazz
@dgrogan空白を表示しています – BenC