博客评论开关,原生js评论开关

今天闲来无事,给网站弄了个有点逗的小黄头背景,看起来挺有意思的,当然只有电脑端才可以看到。其中万千理由,这里就不在一一陈述。

今天和大家分享一下”博客评论开关”的实现,这里主要和大家分享原生的js代码吧:

原理很简单:写一个a标签,然后在里面放了onClick=”cSwitch()”事件,这个a标签一被点击就会触发这个函数。前提是先把要开关的盒子隐藏:display:none; ,js代码如下,关于开关按钮样式啥的大家可以自由发挥,演示可以看老地儿的评论开关功能:

<a class=”cswitch” href=”#cm” onClick=”cSwitch()”>评论</a>
<a name=”cm”></a>//锚点,为了让点击上面a标签能够定位回来。
<script  type=”text/javascript”>
function cSwitch(){
var kgarea=document.getElementById(‘comments’);//获取需要开关的盒子conments的对象,并赋给kgarea
if(kgarea.style.display!=’block’){//判断是否为隐藏,这里不写 ==’none’ 是为了避免一个问题,这里不深究,有兴趣的朋友可以去找找答案。
kgarea.style.display=’block’;//是隐藏的话,利用block来显示盒子
}else{
kgarea.style.display=’none’;//否则,就隐藏它
}
}
</script>

有需要的朋友拿去用吧!

开始是因为觉得下面评论和评论框,还有评论信息填写框占得页面位置太多了,评论开关可以让大家有个选择性,文章看完是否还要看评论,或者写评论,有需要再打开,没需要就没什么必要显示出来了。

博客评论开关,原生js评论开关》有2个想法

发表评论

电子邮件地址不会被公开。 必填项已用*标注