jQuery教程-40-级联查询优化原创

啊，刚才呢，吴晓东同学问的，说我们到了这个post的呀，还有get这个方法里边这个参是固定的吗？是固定的啊，参数的顺序是固定的是固定的，而且呢。它也不是一个Json格式的参数，所以也不需要这个画括号，不需要的啊，你在用的过程中呢，就是直接往里放参数的值就行了，也就是说第一个。大post，第二呢，第一个参数是UR地址，直接写地址就完事了，就是请求的参数函数这些tab数据格式，直接写参数的值就OK了，我代码中的写法就是这样的吗？你看第一个是请求到UR的地址。第二题的参数，参数又是J森格式而已，然后是发处理函数。最后一个是。Jason数据的格式。

这四个参数的顺序是固定的，只能这么写啊，是固定的，它做的是一个post请求的提交。现在我们已经拿到这个数据了，那现在我们把这个数据呢，要更新到我们的城市列表框里面去。还循环到点H，循环的是resp，指定处理函数发XI，逗号N。在函数体中，那我们要向这个C里边呢，去添加上子对象option。我们选中这个CT。啊，选中这个CT。Dollar井号city.a pen添加上我们的option，那我们也像以前一样，把这个option的语句呢拿过来。放到这个引号之中，然后改造一下。

这个值这块呢，应该是用单引号括起来，所以先改成单引号的格式。啊，单引号的格式。是这个样子的，然后这个V流值呢，要用一个变量来替换，所以把它去掉。加上引号，然后给加上是n.ID这是城市的编号。后面这块这个请选择呢，应该是一个内容，这需要一个单引号啊在这呢。这块呢，是一个文本内容也是变化的，所以呢，我们也加上一个变量。这个变量呢是n.name这个ID和name呢，不是我任意起的，是因为在我们查询结果中，我们看到这个Jason对象它的属性一个叫ID，一个叫name。所以这拿的是ID和name的属性，这样的话呢，我们就能够初始化我们的城市了，那这个city呢，它在往里边循环加值之前，应该先把就有数据删除掉，所以这我们要做的是删除。

或者叫清空。好，清空我们的select列表，清空。那么Dollar，然后是井号C。呃，Ck.M这样就清空它了。好，我们现在把我们的代码呢。刷新一下。验证一下我们的最终结果。那么在这啊。中心资源resource。更新之后刷新页面。稍等一下啊，这个项目呢。

没有刷新成功啊，有点卡，我把项目重启一下吧。啊，项目停掉，然后重启一下。好把日志呢清一下，然后重新刷一下我们这个项目。老的。好，然后我们看到这有河北山西，选择山西，然后你看太原大同就加进来了，再选择河北，你看哎四个城市。选择内蒙古呼号到包头、呼伦贝尔，这样我们的数据不就加进来了吗？这就是我们的吉林操作。好，那你看我们这个功能呢，基本上已经写完了啊，完成这样级联查询，现在这是两级的，实际上还有三级的，就是还有列表框。三级以外还有四级的啊多级的，那基本的模式呢，跟这个一样的，选择第一级展示第二级数据，选择第二级展示第三级数据，选择第三集展示第四级数据，这是一级一级的，所以叫做级联查询。

好，这个功能呢，基本上就已经完成了，但是呢，还有一点点要提高的地方。就在这儿大家看啊，我现在是通过这个按钮的单击事件来触发。省份的添加的，但实际上我们在做这个。添加这个收件人地址的时候，你在京东上或淘宝上。不需要你点按钮，它是不是就有第一个。下列尾号的数据啊。就说你省份这个值。默认就有，你不需要做任何操作，这个数据有选择一个省份，然后市就选出来了，所以呢，省份这个数据应该一开始就有，你不需要点按钮，它应该也有，那怎么办呢？那你就是说要在我们这个页面。

这个盗墓对象都加载后，就应该主动发起阿贾克斯请求把省份的数据。加进来，加进来。所以那我们应该选择一个发起请求的时机，在哪发起呢？那就说我们现在是在按钮的单击事件中做的这个阿贾克斯请求，那我也应该是在这儿看着啊，我们的Dollar function。注意这个。Dollar function，它是在这个页面的倒母对象加载成功后执行的函数。

在成功后执行的函数，那么我们在此发起阿贾克斯请求。也是说，当我页面中的。Select，就是下列列表框都创建好了，马上就发请求去获取我们的省份的信息，那我们的这个Dollar阿贾克的请求呢？它是可以被多个地方调用的。按钮单击中能调用，我们在页面加载后也可以调用。那为了让我们的Dollar阿贾克斯这个请求可以被复用，我把它封装到一个函数中。好在最外面这。然后在这我要写一个函数啊，注意这个函数写哪呢，你看啊。大家注意看这个是不是Dollar function呢，在它的外面啊，或者写在上面吧，这么看的清楚，在这写写一个function啊，这个呢，我叫做lot date阿贾克斯啊阿贾克斯，然后呢，我把呢这个阿贾克的请求处理啊。

这这这一段。剪切，我把它扔到上面的函数定义里面去，好，这就完成了。然后我把这个老阿贾克斯函数调用。放到按钮，单击事件里面一次。然后放到页面的加载这一次。Ons。好，接下来看一下效果。更新资源。然后现在访问页面一刷新。我们看这说有了吧，你就不用再按按按钮了，那多麻烦呢，我页面一加载，哎，就发起请求了，在这儿呢，Har province就别拿到数据了吗？就加减上的数据了，选择一个山西啊，就有我们的城市了，选择一个河北就有我们的这四个城市了，这样做的话，用户感觉会更好。

那用户本来也不希望他点按钮嘛，我只要页面一加载数据就加载上了，在我们的页面加载之后发起query pro的请求来获取我们的。省份的信息，这是加载时间。在页面到对象加载成功之后，我主动的就发起一个阿贾克的请求来获取数据。那这里也是按钮单据事件呢，也保留着点，它也能够加载省份的数据，我把呢二点的的请求呢封装到了一个独立的函数之中。调这函数就能做阿贾克斯的请求处理了。好，这是给大家呢。指定一下。阿检索请求它发起的这个时机啊，一个是页面加载后，一个是按钮单击。

再往下我们看看这个大尔点posts的呀，它也可以进一步优化一下，你会发现我们在写这个大点po的时候，这个代码这块显示比较乱的啊，因为这块呢，我们显得这个函数写得这段处理代码，如果这个代码这块代码很长的话，会显得这块啊非常乱。那我现在呢，想把这个处理数据的这个函数啊，把它单独拿出来定义一下，让我们的dota POS调用呢，更加的整洁，更加的规范一些，那怎么做呢，把这个函数定义放到外面来用，那在这。啊，我们来定义一个处理返回数据的函数，啊，函数的函数，那我们怎么做呢？就把这个函数定义拿过来呗。这个代码到这儿。我看到这吧。

CTRLC2。先剪切下来吧。粘到这，那么函数你要是发个定义的话，是不是得有名字呀，比方说这个名字啊，函数的名字叫做call back。包CA，然后这个参数当然是你的复原反应数据了，这就放在这儿了，那这个函数我是从这儿拿过来的，给你扎回去啊，这不是这个意思吗？那就是说当我发起这个请求之后，请求处理成功之后，调用这个函数，这个函数在这定义的，那么这个IP呢，代表是服务器端返回的数据。指定这个名称，就调这个名称的函数，然后这个参数当然是这query给附上去的，好这就行了，这么做的话，你的代码就会很整洁嘛。很整齐啊，你注意这是个独立的函数啊，独立的函数它是在我们这个。

注意看啊，是在我们的这个Dollar发它的最外面定义的，在外面它是个独立的函数啊，独立的啊。我要写在里面是个独立的，它是个单独的函数啊，单独的，然后试一下吧，它这么改造我们代码呢，能不能够正常的执行啊。好，我们来刷新一下。那个页面啊。没问题，你看都可以的。没问题，现在的话，这个代码结构呢，就会更加清晰，更加整洁一些了。好，这是给大家呢做了一个升级，让我们这个代码呢更加的规范好。对于以后的维护呢，也更加的容易和友好。把我们的事件处理函数呢做成单独的函数定义。同时呢，指定了一个发起阿点的请求的一个独立的函数，分两次调用，一个是页面加载后马上调用，一个是按钮单击事件触发调用。

好，这个例子呢就完事了，这个例子呢，稍微的复杂一些，复杂一些。