2013年8月 的存档

jquery table 排序

2013年8月3日 3 条评论

借助于强大的jquery库,通过一些简单的js代码来实现对table数据列进行排序。排序是通过调整table的tr的顺序重新显示,全部在客户端上完成,不需要和服务器交互,因此减轻了服务器的压力。查看Demo请猛点这里

实现排序的js代码如下:

function tableSort(jqTableObj) {
    jqTableObj.find('thead th').click(
        function(){
            var dataType = $(this).attr('dataType') || 'text';
            var index = jqTableObj.find('thead th').index(this) + 1;
            var arr = [];
            var row = jqTableObj.find('tbody tr');

            $.each(row, function(i){arr[i] = row[i]});

            if($(this).hasClass('current')){
                arr.reverse();
            } else {
                arr.sort(Utils.sortStr(index, dataType))

                jqTableObj.find('thead th').removeClass('current');
                $(this).addClass('current');
            }

            var fragment = document.createDocumentFragment();

            $.each(arr, function(i){
                fragment.appendChild(arr[i]);
            });

            jqTableObj.find('tbody').append(fragment);
        }
    );    

    var Utils = (function() {
        function sortStr(index, dataType){
            return function(a, b){
                var aText=$(a).find('td:nth-child(' + index + ')').attr('_order') || $(a).find('td:nth-child(' + index + ')').text();
                var bText=$(b).find('td:nth-child(' + index + ')').attr('_order') || $(b).find('td:nth-child(' + index + ')').text();

                if(dataType != 'text'){
                    aText=parseNonText(aText, dataType);
                    bText=parseNonText(bText, dataType);

                    return aText > bText ? -1 : bText > aText ? 1 : 0;
                } else {
                    return aText.localeCompare(bText)
                }
            }
        }

        function parseNonText(data, dataType){
            switch(dataType){
                case 'int':
                    return parseInt(data) || 0
                case 'float':
                    return parseFloat(data) || 0
                default :
                return filterStr(data)
            }
        }

        //过滤中文字符和$
        function filterStr(data){
            if (!data) {
                return 0;
            }

            return parseFloat(data.replace(/^[\$a-zA-z\u4e00-\u9fa5 ]*(.*?)[a-zA-z\u4e00-\u9fa5 ]*$/,'$1'));
        }

        return {'sortStr' : sortStr};
    })();
}

要想让上面的代码工作,需要在原有的table中注意几点。
1、表头的tr其父元素为thead,另外表头列使用th,同时要使用dataType属性名来标示数据的类型,类型可以为text(默认),int和float;
2、显示table数据的tr父元素为tbody,显示数据的列用td,可以使用_order属性指定该字段的真实值。

table 示例如下:

<table>
  <thead>
    <tr>
      <th datatype="int">ID</th>
      <th datatype="text">Username</th>
      <th datatype="float" class="current">Revenue</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1032</td>
      <td>Zhang</td>
      <td _order="127579">$ 127,579.00</td>
    </tr>
    <tr>
      <td>1074</td>
      <td>gm1</td>
      <td _order="37331">$ 37,331.00</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <th colspan="2">Summary</th>
      <th>$ 164,910.00
    </tr>
  </tfoot>
</table>
分类: web前端 标签:

nginx 配置禁止访问目录或文件

2013年8月1日 没有评论

要禁止某个或一类资源,只需要增加一个location,然后在其中使用deny all即可。

禁止访问扩展名为bat的文件,配置如下:

location ~* /\.bat {
    deny all;
}

禁止访问configs目录,以及其下所有子目录或文件,配置如下:

location ^~ /configs/ {
    deny all;
}

注意上述configs后面的斜杠不能少,否则所有以configs开头的目录或文件都将禁止访问。

分类: nginx 标签:

nginx location 指令匹配顺序

2013年8月1日 没有评论

location指令是server段中的一个指令,可以对不同路径或不同文件类型进行特殊处理。例如用的比较多的就是针对网站的静态内容设置缓存。由于一个server段中可以有多个location,而http请求最终只能使用其中的一个,所以有必要弄清nginx是如何选择location的。

location 指令语法如下:

location [=|^~|~|!~|~*|!~*] uri {

}

上述配置中[]内为可选配置,但只能使用其中一个。关于具体含义,可以参考:nginx 匹配操作符。uri可以是普通字符串或正则表达式。

匹配的顺序是先匹配普通字符串,然后再匹配正则表达式。另外普通字符串匹配顺序是根据配置中字符长度从长到短,也就是说使用普通字符串配置的location顺序是无关紧要的,反正最后nginx会根据配置的长短来进行匹配,但是需要注意的是正则表达式按照配置文件里的顺序测试。找到第一个比配的正则表达式将停止搜索。

一般情况下,匹配成功了普通字符串location后还会进行正则表达式location匹配。有两种方法改变这种行为,其一就是使用“=”前缀,这时执行的是严格匹配,并且匹配成功后立即停止其他匹配,同时处理这个请求;另外一种就是使用“^~”前缀,如果把这个前缀用于一个常规字符串那么告诉nginx 如果路径匹配那么不测试正则表达式。

总结下来location指令的匹配顺序为:
1、“=”前缀指令匹配,如果匹配成功,停止其他匹配
2、普通字符串指令匹配,顺序是从长到短,匹配成功的location如果使用“^~”前缀,则停止其他匹配。
3、正则表达式指令匹配,按配置文件里的顺序,成功就停止其他匹配。
4、如果第3步中有匹配成功,则使用该结果,否则使用第二步中的匹配结果。

分类: nginx 标签:

php 异步执行脚本

2013年8月1日 没有评论

这里说的异步执行是让php脚本在后台挂起一个执行具体操作的脚本,主脚本退出后,挂起的脚本还能继续执行。比如执行某些耗时操作或可以并行执行的操作,可以采用php异步执行的方式。主脚本和子脚本的通讯可以采用外部文件或memcached的方式。原理就是通过exec或system来执行一个外部命令。注意:本文所述的是针对Linux环境。

在Linux下要让一个脚本挂在后台执行可以在命令的结尾加上一个 “&” 符号,有时候这还不够,需要借助nohup命令,关于nohup,可以参考http://www.netingcn.com/linux-nohup.html

CLI环境和Web环境执行的操作还不太一样。先来说CLI环境,这里需要用上nohup和&,同时还要把指定输出,如果不想要输出结果,可以把输出定向到/dev/null中。现在来做一个测试,假设在一个目录中有main.php、sub1.php和sub2.php,其中sub1和sub2内容一样都让sleep函数暂停一段时间。代码如下:

//main.php
<?php
    $cmd = 'nohup php ./sub.php >./tmp.log  &';
    exec($cmd);
    $cmd = 'nohup php ./sub1.php >/dev/null  &';
    exec($cmd);
?>

//sub1.php sub2.php
<?php
    sleep(100000);
?>

上述文件中main.php是作为主脚本,在命令行中执行php main.php,可以看到main.php脚本很快就执行完并退出。在使用ps aux | grep sub命令搜索进程,应该可以在后台看到上述的两个子脚本,说明成功挂起了子脚本。

在Web环境下,执行php脚本都是Web服务器开启的cgi进程来处理,只要脚本不退出,就会一直占有该cgi进程,当启动的所有cgi进程都被占用完后就不能在处理新的请求。所以对那些可能会很费时的脚本,可以采用异步的方式。启动子脚本的方式和CLI差不多,必须要使用&和指定输出(只好是定向到/dev/null),但是不能使用nohup。例如:

<?php
    $cmd = 'php PATH_TO_SUB1/sub1.php >/dev/null  &';
    exec($cmd);
    $cmd = 'php PATH_TO_SUB1/sub2.php >/dev/null  &';
    exec($cmd);
?>

当在浏览器中访问该脚本文件,可以看到浏览器里面响应完成,同时使用ps命令查看后台可以看到sub1和sub2脚本。

注意上述例子中如果php命令不在PATH中,需要指定命令完整的路径。推荐使用完整路径,特别是在Web下。

无觅相关文章插件,快速提升流量