PHP中直接使用jQuery

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› PHP›PHP编程经验

原作者: [db:作者] 来自: [db:来源] 收藏邀请

用PHP控制jQuery，目的在ajax请求中不同的请求不用独立写js，在php中实现client功能，可以调用全部jquery方法，并且可以采用jquery的链式语法。

js部分

//处理所有ajax返回
function processResponse($obj, data) {
    for (var i=0; i<data.length; i++) {
        if ('this' === data[i].selector) {
        } else if ('jQuery' === data[i].selector) {
            $obj = jQuery;
        } else {
            $obj = jQuery(data[i].selector);
        }
        delete data[i].selector;
        for (var command in data[i]) {
            for (var j=0; j<data[i][command].length; j++) {
                $obj = $obj[command].apply($obj, data[i][command][j]);
            }
        }
    }
}

这个js function用来处理ajax请求PHP处理后返回的json对象，把其中的jQuery指令翻译成js执行

    $(body).on('submit', 'form[target="background"]', function() {
        var formData = new FormData(this);
        $form = $(this);
        $.ajax({
            type: 'POST',
            url: this.action,  
            data: formData,
            /** 
             *必须false才会自动加上正确的Content-Type
             */  
            contentType: false,  
            /** 
             * 必须false才会避开jQuery对 formdata 的默认处理
             * XMLHttpRequest会对 formdata 进行正确的处理
             */  
            processData: false,
            dataType: 'json',
            success: function(data){
                processResponse($form, data);
            }
        });
    }

拦截所有target=background的表单的提交动作，转为 ajax请求，将返回交给上面的函数处理，同事传递该表单的jQuery封装对象到处理函数中

class Tuki_jQuery {

    private static $_data = array();
    private $_key = 0;

    function __construct($selector = 'jQuery') {
        $this->_key = count(self::$_data);
        self::$_data[$this->_key] = array('selector' => $selector);
    }
    
    function __toString() {
        return json_encode(self::$_data);
    }
    
    function __call($name, $arguments) {
        self::$_data[$this->_key][$name][] = $arguments;
        return $this;
    }

    static function getData() {
        return count(self::$_data) ? json_encode(self::$_data) : '';
    }
    
}

function jQuery($selector = 'jQuery') {
    return new Tuki_jQuery($selector);
}

php库，将php中的jQuery指令封装成json对象

调用方式

1. 调用jQuery对象的方法
jQuery()->alert('hello, world');
/*alert是自己给客户端jQuery js对象添加的方法
jQuery.alert = function(message) {
    alert(message);
    
    return jQuery;
};*/

2. 选择元素后执行代码
jQuery('#popup_box')->html(ob_get_clean());

3. 直接基于发起ajax的对象处理
jQuery('this')->html('submited')->hide();

3种方式在一个页面请求中可以同时多次使用，只需要在最后使用echo Tuki_jQuery::getData() 输出json文本