永久隐藏/显示方块 [英] Hide/show a block permanently

问题描述

我正在使用slidetoggle打开和关闭div，并使用jquery进行了缓解.

I am using slidetoggle to open and close div, with easing using jquery.

<script>
 function toggleText() {
 $('#divToToggle').slideToggle("slow");
 if ($('#divToToggle').css('display') == 'none') {
      $('#aTag').html('Show');
 }
 else {
      $('#aTag').html('Hide');
 }
 }
</script>
<a id="aTag" href="javascript:toggleText();">
  Hide
</a>

它控制的div是<div id="divToToggle"></div>

我遇到的问题是onclick文本没有改变，从显示"到隐藏"，反之亦然...我必须缺少一些非常简单的东西.

Issue I have is onclick the text isnt changing , from Show to Hide and vice versa... I must be missing something very very simple..

Bugger还想问我如何将Cookie附加到事件中

Bugger also meant to ask, how do i attah a cookie to the event

推荐答案

尝试一下.这将起作用

<script>
     function toggleText() {
          $('#divToToggle').slideToggle("slow", function(){
             if ($('#divToToggle').css('display') == 'none') {
                 $('#aTag').html('Show');
             }
             else 
             {
                 $('#aTag').html('Hide');
             }    
       });    
     }
</script>
<a id="aTag" href="javascript:toggleText();">
      Hide
</a>

这是有关如何设置和删除Cookie的简单功能- src -

EDIT : Here is a simple function on how to set and delete a cookie - src -

  function setCookie(name,value,days) {
        if (days) {
            var date = new Date();
            date.setTime(date.getTime()+(days*24*60*60*1000));
            var expires = "; expires="+date.toGMTString();
        }
        else var expires = "";
        document.cookie = name+"="+value+expires+"; path=/";
    }

    function getCookie(name) {
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for(var i=0;i < ca.length;i++) {
            var c = ca[i];
            while (c.charAt(0)==' ') c = c.substring(1,c.length);
            if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
        }
        return null;
    }

    function deleteCookie(name) {
        setCookie(name,"",-1);
    }

   function toggleText() {
              $('#divToToggle').slideToggle("slow", function(){
                 if ($('#divToToggle').css('display') == 'none') {
                     $('#aTag').html('Show');
                      deleteCookie('hiddendiv') 

                 }
                 else 
                 {
                     $('#aTag').html('Hide');
                     setCookie('hiddendiv',1,MENTOINYOURTIMEHERE)  
                 }    
           });    
         }

  $('aTag').click('toggleText');
  if(getCookie('hiddendiv'))
  {
    $('#divToToggle').hide();
  }

<a id="aTag" href="javascript:toggleText();">
      Hide
</a>
<div id ="divToToggle"></div>

这篇关于永久隐藏/显示方块的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！