DISCUZ架构:AJAX之ajax.js 函数

有了这些理论的基础就可以分析一下ajax的具体实现了，下面就以注册过程中的检查用户名在数据库是不是存在并给用户提示这样一个ajax过程进行全程分析。
用到如下的几个文件：

以下为引用的内容：
./register.php
./ajax.php
./include/javascript/common.js
./include/javascript/ajax.js
./template/default/register.htm  


其实register.php这个文件没什么多大的关系，不过register.htm模板是通过它解析过来的，所以就提出来了。

大家都知道在注册过程中是在输完用户名并输入密码的时候才会触发事件检查是不是用户存在，所以很明显，这个是input的onBlur事件。
好了，现在看看./templates/default/register.htm这个文件。

以下为引用的内容：
<tr>
        <td class="altbg1" width="21%"><span class="bold">{lang username}</span></td>
        <td class="altbg2"><div class="input"><input type="text" name="username" size="25" maxlength="15" id="username" onBlur="checkusername()"></div><div id="checkusername"></div>
        </td>
        </tr>  


很简单的HTML代码，注意看到 onBlur="checkusername()"这里，继续往下深入，看看这个函数是做什么的。      

以下为引用的内容：
function checkusername() {
                var username = trim($('username').value);
                if(username == lastusername) {
                        return;
                } else {
                        lastusername = username;
                }
                var cu = $('checkusername');
                var unlen = username.replace(/[^\x00-\xff]/g, "**").length;


                if(unlen < 3 || unlen > 15) {
                        warning(cu, unlen < 3 ? profile_username_tooshort : profile_username_toolong);
                        return;
                }
                ajaxresponse('checkusername', 'action=checkusername&username=' + username);
        }



第一行是得到username的值，也就是我们输入的，lastusername应该是我们在返回的时候不会让用户名消失用的，应该是写入cookie或者是其他。
接下来判断经过了替换的用户名是不是大于15或者小于3，是的话直接调用warning这个函数(稍后讲这样一个函数)并返回，不是的话就调用ajaxresponse函数发出ajax请求，看看ajaxresponse这个函数就是关键所在了。

以下为引用的内容：
        function ajaxresponse(objname, data) {
                var x = new Ajax('XML', objname);
                x.get('ajax.php?inajax=1&' + data, function(s){
                        var obj = $(objname);
                        if(s == 'succeed') {
                                obj.style.display = '';
                                obj.innerHTML = '<img src="{IMGDIR}/check_right.gif" width="13" height="13">';
                                obj.className = "warning";
                        } else {
                                warning(obj, s);
                        }
                });
        }  


ajaxresponse函数来了，这个作用就是实例化一个ajax对象，注意到我们先前说的recvType，就是第一个传入参数，这里固定成了XML，Discuz喜欢用XML(^^)，然后发出请求，这里全部用的是get(第二行)，地址是ajax.php?inajax=1&加上传入的参数，所以结合上面就变成：ajax.php?inajax=1&action=checkusername&username=用户名，构造出来了一个URL，（大家可以自己测试一下看看返回的是什么东东，通过http://你的URL/ajax.php?inajax=1&action=checkusername&username=用户名）通过XMLHttpRequest发出去，注意那个处理函数：function(s)，实际这个函数作为参数已经写出来了，如果最后返回的是succed，那么就在obj这个层里（在这个例子中对应id='checkusername'这个层）显示一个带勾的图，否则的话还是调用warning这个函数。下面就分析这个函数。

以下为引用的内容：

        function warning(obj, msg) {
                if((ton = obj.id.substr(5, obj.id.length)) != 'password2') {
                        $(ton).select();
                }
                obj.style.display = '';
                obj.innerHTML = '<img src="{IMGDIR}/check_error.gif" width="13" height="13">   ' + msg;
                obj.className = "warning";
        }



warning函数前面两次提到，其实这个函数很简单，实现的作用就是在obj这个层里打一个叉，然后写上错误的原因，把obj这个层的CSS class设置成为warning。当然，最开始也验证了一下两次密码是否一致，这里就不说了。

接下来当然是要分析这个ajax.php是怎么一回事，它做了哪些使function(s)中能返回我们要的东西。由于只分析检查用户名这一个部分，我这里就只分析action=checkuser这一部分了。

以下为引用的内容：
elseif($action == 'checkusername') {

                $username = trim($username);

                $guestexp = '\xA1\xA1|^Guest|^\xD3\xCE\xBF\xCD|\xB9\x43\xAB\xC8';
                $censorexp = '/^('.str_replace(array('\\*', "\r\n", ' '), array('.*', '|', ''), preg_quote(($censoruser = trim($censoruser)), '/')).')$/i';
                if(preg_match("/^\s*$|^c:\\con\\con$|[%,\*\"\s\t\<\>\&]|$guestexp/is", $username) || ($censoruser && @preg_match($censorexp, $username))) {
                        showmessage('profile_username_illegal');
                }

                $query = $db->query("SELECT uid FROM {$tablepre}members WHERE username='$username'");
                $username = dhtmlspecialchars(stripslashes($username));

                if($db->num_rows($query)) {
                        showmessage('register_check_found');
                }




这里可以看到是标准的php判断了，有点点php基础就能看懂了，基本上的功能就是判断一个用户是不是在后台设置的禁用用户名中。
是的话就showmessage不合法（注：这里的showmessage不是我们理解的那个跳转，而是一个xml文档，为什么会这样我等会会介绍）
然后就从数据库找是不是有这样一个用户，如果是的话就showmessage 发现了已注册的用户名，不是话就都跳过，直接到最后的：

showmessage('succeed');

注意当所有的判断都成功的话就说明合法了，会调用showmessage来显示一个succeed。

最后说一下为什么这里的showmessage不是我们理解的那个跳转了。

注意在register.htm中的ajaxresponse函数有这样一句：x.get('ajax.php?inajax=1&' + data, function(s){
对了，inajax=1，就是这么一个参数，showmessage就天差万别了。