按位操作应用实例

需求

用户登陆后有多个列表页面中都有搜索功效,由于搜索的条件比拟多,所以加了个“更多”按钮隐蔽了一部份条件,只把常常使用的条件直接显示出来。但有些用户会经常常使用到更多中的条件来搜索,所以愿望当点击了“更多”按钮后,我刷新页面或下次再登陆进来后那个更多中的条件默许就是显示的。

剖析

一下子就想到用cookie来做,每一个用户每一个页面设置个不同的cookie。
但这样会有个问题就是cookie个数太多了。。,去搜索引擎搜索了下,每一个站点的cookie是有数目限制的。
不过,即使没有限制,想一想那末多个cookie也是件很恐惧的事情。

解决

之前学习mysql的时候,知道可以用无符号的tinyint来存储最多8个数据的0和1的状况,就是将255转换为二进制然后商定第几位代表固定的某个数据或某个物品,1和0来标识其状况。
那这里我想也能够用相似的办法。这样的话,每一个用户只用一个相应的cookie便可以够弄定了。

实现

下面这个是每一个页面不同的部份:

<script type="text/javascript">
    var searchMoreMark = 1;//标识:页面一为1、页面二为2、页面三为4、页面四为8、页面五为16、页面六为32、页面七为64。。顺次类推。
</script>

这里是公用的部份,须要先引入jQuery及jQuery.cookie

<script type="text/javascript">
    var searchMoreCookieExpire = 36500;//cookie有效时光
    var searchMoreCookieName = "searchmore_<?=$_SESSION["LOGIN_USER_ID"]?>";//依据用户来辨别
    jQuery(document).ready(function() {
        //点击展开操作
        jQuery("#do_search_more").click(function(){
            jQuery("#more_condition").css("display","block");
            jQuery("#do_search_more").css("display","none");
            jQuery("#do_search_less").css("display","block");
            jQuery(window).resize();
            //设置“更多”状况
            if(jQuery.cookie(searchMoreCookieName)==null || jQuery.cookie(searchMoreCookieName)==0){
                //如果没有设置过cookie,就设置cookie为当前页面的标识
                jQuery.cookie(searchMoreCookieName, searchMoreMark, {expires:searchMoreCookieExpire, path:"/"});
            }else if((jQuery.cookie(searchMoreCookieName) & searchMoreMark) == 0){
                //如果设置过cookie且不存在当前页面的标识的话就把当前页面标识加进过
                jQuery.cookie(searchMoreCookieName, parseInt(jQuery.cookie(searchMoreCookieName)) | searchMoreMark, {expires:searchMoreCookieExpire, path:"/"});
            }
        });

        //点击压缩操作
        jQuery("#do_search_less").click(function(){
            jQuery("#more_condition").css("display","none");
            jQuery("#do_search_more").css("display","block");
            jQuery("#do_search_less").css("display","none");
            jQuery(window).resize();
            if(jQuery.cookie(searchMoreCookieName)!=null){
                //去除本页面的标识
                searchMoreMark = jQuery.cookie(searchMoreCookieName) & (~searchMoreMark);
                //如果标识为0,那末就删除掉这个cookie
                if(!searchMoreMark){
                    searchMoreCookieExpire = -1;
                }
                jQuery.cookie(searchMoreCookieName, searchMoreMark, {expires:searchMoreCookieExpire, path:"/"});
            }
        });
        //默以为上一次的状况(压缩或展开)
        if(jQuery.cookie(searchMoreCookieName)!=null && (jQuery.cookie(searchMoreCookieName) & searchMoreMark) != 0){
            jQuery("#do_search_more").click();
        }
    }
</script>