[英]Show hidden div permanently throughout website after clicking on a specific <a> href link once
我发现了这个问题的链接 ,就像我遇到的那样,问题是他们提供的解决方案是单击html中的任何div,我需要类似的内容,当我单击第一个div时,第二个div显示何时我按第二个div,显示第三个div。 而且我需要保留在本地存储中...这是我的HTML代码:
<div id='btn1' class="col-lg-4"">
<a id="tema_1 " href="tema.html"><img id="img_tema1" class="img-circle" src="../assets/img/primer_tema.gif" alt="Generic placeholder image" width="140" height="140"></a>
<h2>Tema 1</h2>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4-2">
<a href=""><img id="img_tema2" class="img-circle2" src="../assets/img/segundo_tema.gif" alt="Generic placeholder image" width="140" height="140"></a>
<h2>Tema 2</h2>
</div><!-- /.col-lg-4-2 -->
<div class="col-lg-4-3">
<a href="tema_3.html"><img id="img_tema3" class="img-circle3" src="../assets/img/tercer_tema.gif" alt="Generic placeholder image" width="140" height="140"></a>
<h2>Tema 3</h2>
</div><!-- /.col-lg-4-3 --
这是我使用的Jquery代码的示例:
var hide2 = localStorage[location] ? false : true;
var hidden2 = document.querySelector('.col-lg-4-2');
if(hide2) {
hidden2.style.display = 'none';
document.onclick = function() {
localStorage[location] = true;
hidden2.style.display = '';
document.onclick = '';
console.log('click');
}
}
但是,正如我所说的那样,它会使我单击的任何div都显示Tema 2,并且我需要能够显示Tema 2的唯一div是Tema 1 Div。
对不起,我的英语不好,但我的母语是西班牙语。
感谢您的任何帮助。
我认为可以使用简单的jQuery解决此问题。 我使用了以下示例中指定的示例: 上一个类似的问题 ,并将其更改为适合您的代码。 它目前可以正常工作,但是如果您不喜欢我的解决方案,我可能想解决它。
$(function () {
var showLittleHeader = localStorage.getItem('#second-img');
if (showLittleHeader) {
$('#second-img').show();
}
$('#first-img').on('click', function () {
localStorage.setItem('#second-img', 1);
$('#second-img').show();
});
});
$(function () {
var showLittleHeader = localStorage.getItem('#third-img');
if (showLittleHeader) {
$('#third-img').show();
}
$('#second-img').on('click', function () {
localStorage.setItem('#third-img', 1);
$('#third-img').show();
});
});
查看此JS Fiddle,看看它是否对您有用:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.