jQuery Tablesorter插件-如何在离开页面时保存状态


jQuery Tablesorter plugin - how to save the state when leaving the page

我使用的是jQuery Tablesorter插件,它运行良好。然而,存在一个问题。想象一下,你有一些排序顺序,但你想活在页面上,然后很快回来。不幸的是,当你回来时,你会得到最初的排序顺序,这完全是错误的。因此,我试图找到一条线索,如何在一些变量中保存Tablesorter的状态(离开页面时记住排序选择),并使用php中的_GET通过URL传递它。任何想法和帮助都将不胜感激。

我做了一点研究,发现了以下内容:
1.您可以读取当前分拣

     <script>
    $(window).unload( function () {   
    var sortList;  
    $(table).tablesorter().bind("sortEnd", function(sorter)   
    {      
        sortList = sorter.target.config.sortList;  
        $_GET['sortList'] = sortList;  
    });   
    }  
    );
    </script>

2.我试着像上面那样保存排序列表,并在页面加载时阅读:

<script>  
$(document).ready(function()   
    {   
        sortList=$_GET['sortList'];  
        $.tablesorter.defaults.widgets = ['zebra'];   
        $.tablesorter.defaults.sortList = [[1,0]];   
        $("table").tablesorter();   
    }   
);      
</script>
  1. 不起作用,我认为这两行有问题:

    sortList=$_GET['sortList'];。。。$_GET['sortList']=排序列表;

我在这里混合了JavaScript语言、PHP和数据类型。但我不是一个专业的程序员,我不能把这些点联系起来。有什么帮助吗?

Alex

我在github上有一个表分类器插件的分支,我写了一个名为"saveSort"(演示)的小部件,如果浏览器有HTML5或cookie作为后备,它会将最后一次排序存储到localStorage中。

尝试这个库jQuery Address在使用window.location.hash对象的解决方案中工作。我目前正在一个项目中使用它,效果很好。

根据页面的编码方式,一些浏览器会自动记住上次的状态。但很可能不会,尤其是在旧浏览器上。

一个基本的跨浏览器解决方案是将状态信息存储在window.location.hash对象中。换句话说,对于您想要记住的任何事件或状态,您都可以将散列更改为唯一标识符:

window.location.hash = 'column1'

这会将#clicked-button添加到URL的末尾。您可能希望在用户对表进行排序时调用此函数。不过,光靠这一点也无济于事。第二步是侦听对哈希的更改。IE有一个onhashchange事件,但我认为其他浏览器不支持该事件。另一种选择是设置一个手动侦听的间隔。

var last_hash = '';
setInterval(function()
{
    if(window.location.hash != last_hash)
    {
        //a new event happened, change the state of the page
        last_hash = window.location.hash;
        if(last_hash == 'column1')
        {
            //sort based on column1
        }
        else if(last_hash == 'column2')
        {
            //sort based on column2
        }
        //etc
    }
}, 500);

这样的脚本将继续运行,即使用户离开页面然后返回。

你也可以阅读这些来了解更多关于其他技术的信息。

  • 打开-window.location.hash-更改
  • Ajax、后退按钮和DOM更新
  • http://ajaxian.com/archives/emulating-onhashchange-without-setinterval