• JavaScript按钮倒计时示例

    最早的倒计时效果应该是普遍应用在注册协议那一关,可能是网站为了防止恶意注册而出此下策。现在发送手机信息已是众多网站中常见的一种交互方式了,其中最普遍的就是发送手机验证码。

    为了防止用户恶意点击发送验证码造成损失,几乎所有网页中要发送验证码的地方都做了JavaScript倒计时控制,当然最安全的还是要在服务器端做控制。即当用户点击了按钮获取验证码后,需要等待三十秒或六十秒才能再次点击,以下是示例代码

    JavaScript code

    /** 
     * 琼台博客 www.qttc.net
     * 倒计时函数
     * 需要在按钮上绑定单击事件
     * 如: <input value="发送短信" data-cke-editable="1" data-cke-pa-onclick="setInterval('countDown(this,30)',1000);" contenteditable="false" type="button">
     * 30代表秒数,需要倒计时多少秒可以自行更改
     */
    function countDown(obj,second) {
      // 如果秒数还是大于0,则表示倒计时还没结束
      if(second>=0){
        // 获取默认按钮上的文字
        if(typeof buttonDefaultValue === 'undefined' ){
          buttonDefaultValue =  obj.defaultValue;
        }
        // 按钮置为不可点击状态
        obj.disabled = true;            
        // 按钮里的内容呈现倒计时状态
        obj.value = buttonDefaultValue+'('+second+')';
        // 时间减一
        second--;
        // 一秒后重复执行
        setTimeout(function(){countDown(obj,second);},1000);
      // 否则,按钮重置为初始状态
      }else{
        // 按钮置未可点击状态
        obj.disabled = false;   
        // 按钮里的内容恢复初始状态
        obj.value = buttonDefaultValue;
      }   
    }
    

    ...

    READ ALL

  • jQuery实现全选反选效果

    有时候,我们对一些列表操作经常需要全选,反选功能。例如博客里文章列表,我们可以全选或反选后可以对选中的文章进行删除,下线,移动,复制等操作。下面直接贴出例子代码

    jQuery code

    // 琼台博客 www.qttc.net
    
    // 当文档加载完后      
    $(document).ready(function(){
      // 给全选框加上动作    
      $(":checkbox[value='全选']").click(function(){
        // 获取全部标签
        $ul = $('ul li :checkbox');
        // 判断勾选还是取消
        if($(this).is(':checked')){
          // 如果勾选则全部选项选上            
          $ul.each(function(){
            $(this).attr('checked',true);
          });    
        }else{
          // 如果取消则全部选项取消            
          $ul.each(function(){
            $(this).attr('checked',false);
          });        
        }            
      });
    
      // 给反选框加上动作
      $(":checkbox[value='反选']").click(function(){
        // 获取全部标签
        $ul = $('ul li :checkbox');
    
        $ul.each(function(){
          // 判断是否已经勾选
          if($(this).is(':checked')){
            // 如果已经勾选则取消
            $(this).attr('checked',false);
          }else{
            // 如果未勾选则选上    
            $(this).attr('checked',true);    
          }
        });                
      });
    
      // 给每个多选框加入动作
      $('ul li :checkbox').click(function(){
        // 获取未选标签
        $ul = $('ul li :checkbox:not(:checked)');
        // 判断是否有元素
        if($ul.length){
          // 如果有未选则取消全选框勾选状态    
          $(":checkbox[value='全选']").attr('checked',false);
        }else{
          // 如果没有则自动勾选上全选框状态    
          $(":checkbox[value='全选']").attr('checked',true);
        }
      });
    });
    

    ...

    READ ALL

  • PHP升到5.4版后PDO无法使用解决方法

    昨天闲着无事,一贯追求最新版本的我也想试试最PHP最新版5.4的一些新功能。由于只是升级安装,所以升级过程非常简单

    • 下载PHP5.4版
    • 解压,配置,安装。安装目录直接指定原来安装的PHP目录覆盖安装
    • 安装后,杀掉php-fpm,重启Nginx,启动php-fpm

    打开phpinfo()发现PHP已从原来的5.3.6变成了5.4.0,一阵狂喜。于是赶紧打开服务器上的项目挨个看看,其它项目都还正常,只是其中有一个项目报错提示找不到驱动模块。

    郁闷,来不及多想谷歌一下发现大多数网友都说把php.ini配置文件里的相应模块打开

    ...

    READ ALL

  • JavaScript跳转页面的几种方法

    有时候,我们除了使用a标签跳转页面外使用JavaScript跳转页面也是经常使用的方式,例如定时跳转或者处理完某个程序后跳转等等。下面贴出几种常用的跳转方式

    第一种

    window.location.href='https://www.qttc.net/';
    

    第二种

    根据历史记录

    window.history.back(-1);
    window.history.forward();
    window.history.go(1);
    

    第三种

    window.navigate("https://www.qttc.net");
    

    ...

    READ ALL

  • PHP工厂模式

    在面向对象编程中, 最通常的方法是一个new操作符产生一个对象实例,new操作符就是用来构造对象实例的。但是在一些情况下, new操作符直接生成对象会带来一些问题。举例来说, 许多类型对象的创造需要一系列的步骤:

    • 你可能需要计算或取得对象的初始设置
    • 选择生成哪个子对象实例

    或在生成你需要的对象之前必须先生成一些辅助功能的对象。 在这些情况, 新对象的建立就是一个 “过程”,不仅是一个操作,像一部大机器中的一个齿轮传动。

    工厂模式就是解决这个问题而来,工厂模式是我们最常用的实例化对象模式,是用工厂方法代替new操作的一种模式。

    ...

    READ ALL

  • PHP单例模式

    什么是单例

    首先我们要知道明确单例模式这个概念,那么什么是单例模式呢?单例模式顾名思义,就是只有一个实例。

    作为对象的创建模式, 单例模式确保某一个类只有一个实例,而且自行实例化并向整个系统提供这个实例,这个类我们称之为单例类。

    单例模式的要点有三个

    • 某个类只能有一个实例
    • 它必须自行创建这个实例
    • 它必须自行向整个系统提供这个实例

    单例有什么用

    下面我们讨论下为什么要使用PHP单例模式?

    多数人都是从单例模式的字面上的意思来理解它的用途, 认为这是对系统资源的节省, 可以避免重复实例化, 是一种"计划生育". 而PHP每次执行完页面都是会从内存中清理掉所有的资源。 因而PHP中的单例实际每次运行都是需要重新实例化的, 这样就失去了单例重复实例化的意义了。 单单从这个方面来说, PHP的单例的确有点让各位失望. 但是单例仅仅只有这个功能和应用吗? 答案是否定的,我们一起来看看。

    ...

    READ ALL

  • MySQL存储过程

    可以这么创建

    DROP PROCEDURE IF EXISTS text;
    CREATE PROCEDURE text()
      BEGIN
         #这里写过程语句
      END;
    

    比如,存储过程我需要查询一个表,可以这么写

    DROP PROCEDURE IF EXISTS text;
    CREATE PROCEDURE text()
      BEGIN
        SELECT * from users;
      END;
    

    你也可以查询多张表,如

    DROP PROCEDURE IF EXISTS text;
    CREATE PROCEDURE text()
      BEGIN
        SELECT * from table1;
        SELECT * from table2;
        SELECT * from table3;
      END;
    

    ...

    READ ALL

  • CentOS更改ssh端口禁止root登录

    修改端口

    ssh默认端口为22,把默认端口改成别的端口可以极大提升服务器的安全性

    vim /etc/ssh/ssh_config
    

    找到port,然后修改为

    port 7000
    

    重启sshd服务

    service sshd restart
    

    再次使用ssh登录的时候,需要使用7000端口了,而不是默认的22端口

    禁止root登录

    生产机器禁止root远程SSH登录,可以这么干

    vim /etc/ssh/sshd_config
    

    PermitRootLogin yes
    

    ...

    READ ALL

  • Nginx反向代理

    Nginx反向代理非常强大,先来看看一个图

                      +--- host --------> node.js on localhost:8080
                      |
    users --> nginx --|--- host/blog ---> node.js on localhost:8181
                      |
                      +--- host/mail ---> node.js on localhost:8282
    

    用户访问Nginx,再由Nginx转发给后端node.js服务,而后端的node.js服务可以无限水平扩展来解决后端流量过大的问题

    ...

    READ ALL

  • PHP清理Memcached过期缓存内容

    Memcached缓存可以很大的提升动态页面性能,特别是对于实时性要求不高的内容,但通常缓存都是要求又周期性的,否则新的内容就无法再次被缓存。所以通常缓存的内容都有一个时效性以便再次进行更新,这个看不同的业务场景分不同类型的数据进行设置时效性,有的每分钟,有的每一个小时,有的甚至上月

    我们经常会使用Memcached的存储过期功能,而实际上在过期后,Memcached并不能马上回收过期内容,这样会很快存满至配置限制,根据不同配置,Memcached会采用LRU算法删除缓存内容或使用时删除过期内容,而有时Memcached这样的释放内存的机制并不能满足所有应用,故我们在PHP基础上实现了统一删除过期内容的功能,适用于定时清理。

    ...

    READ ALL