异步传输ajax 什么是异步传输，首先让我们看看传统的数据加载方式“同步传输”，传统的页面加载一般是从上开始往下加载的，当需要加载 js 的时候，是阻塞加载，当引用了 js 的时候，浏览器发送一个 js request 就会一直等待该 request 的返回。因此这样写会提示错误的： up document.getElementById("ss").innerHTML = "sdfsdf"; dfgdfg 网页上依然会显示"dfgdfg"，而不是执行 js 语句后的形态。使用“谷歌浏览器”审查元素就会发现，提示 Uncaught TypeError: Cannot set property 'innerHTML' of null。可是如果将 script 块放在 div 的后面就会正常，因为在浏览器从上往下开始解析的时候，解析到第 6 行的时候，浏览器根本不知道 ss 这个元素的存在，因此会进行报错，可是如果把 js 放在后面，在浏览器解析到 document.getElementById("ss")时，已经知道了 ss 是什么东西了，因此浏览器会显示"sdfsdf"。现在我们再来谈一下传统的 web 请求，在传统的 web 应用中，允许用户填写表单，当提交表单时就向 web 服务器发送一个请求，服务器接收并处理传来的表单，然后返回一个新的网页。可是这样的作法很是浪费带宽，因为在前后的这个页面中大部分 HTML 往往是相同的。由于每次应用的交互都需要向服务器发送请求，应用的响应时间久依赖于服务器的响应时间。这导致了用户界面的响应比本地应用慢得多。可是异步传输就不一样，异步传输可以像服务器发送并取回自己必需的数据，不要的数据不必也不需要请求，它使用 SOAP 或其他一些基于 XML 的 web service 接口，并在客户端采用 JavaScript 处理来自服务器的响应。因此在服务器和路蓝旗的交换的数据大量减少，我们就能看到响应更快的应用。同时很多的处理工作可以在发出请求的客户端上完成，所以服务器的处理时间就会减少。通过上面的图片，我们就很清楚地看到了异步请求的过程。其实上面的“用户继续执行其他的操作”换成“浏览器继续执行其他的操作”应该更合适一些吧。我们身边有很多这样的异步请求的例子，比如注册用户信息时，用户名不能重复，邮箱不能重复注册，当我们把焦点移开当前输入框时便提示我们用户名和邮箱是否可用，而不是我们以前的那样当提交所有的信息时才提示我们用户名是否可用，这就用到了异步请求 ajax 技术。像上面的图片那样，当我们的焦点移开用户名输入框时，浏览器便通过 js 向服务器请求输入的用户名是否可用，服务器检索数据库检测用户名是否已经存在，然后返回信息，js 再根据返回的信息通过浏览器提示用户用户名是否可用；而用户的操作便是将焦点移动到下一个输入框。所有的操作在我们的页面没有任何的跳转和刷新的情况下就完成了。使用异步请求 ajax 最大的优点，就是能在不更新整个页面的前提下维护数据。这使得 web 应用程序更为迅捷地回应用户动作，并避免了在网络上发送那些没有改变过的信息。同时 ajax 不需要任何浏览器插件，但需要用户的浏览器能够运行 js，因为有的用户可能会有意或无意的关闭浏览器 js 运行，使得某些操作不能进行。使用 ajax 非常的方便，而且现在还有很多的 js 框架封装了 ajax 的使用，就更加的方便了。下面我就使用传统的 javascript 方式和 jQuery 框架两种形式来讲解一下 ajax 的使用。 1. 传统的 javascript 方式： # 创建 HttpRequest； 向服务器发送请求； 服务器响应； 处理服务器返回数据。 1.1 创建 HttpRequest # 由于 IE 的创建方式与其他的浏览器不一样，因此在创建的时候我们应该使用两种方式来创建。function createXMLHttpRequest() { //创建XMLHttpRequest对象 if (window.XMLHttpRequest) { //非IE浏览器 httpRequest = new XMLHttpRequest(); } else if (window.ActiveXObject) { httpRequest = new ActiveXObject("Microsoft.XMLHTTP"); } } 我已经把 httpRequest 变量声明在了所有函数的外面。 1.2 向服务器发送请求 # 可以调用 HTTP 请求类的 open()和 send()方法，具体的调用方式是这样的。url = "card_que_test.php?page=" + page + "&pno=" + pno + "&pname=" + pname + "&identitycard=" + identitycard + "&sex=" + sex + "&ismarried=" + ismarried; httpRequest.open("GET", url, true); httpRequest.onreadystatechange = handle; //指定响应函数 httpRequest.send(null); open()的第一个参数 HTTP 请求方式：GET,POST 或任何服务器所支持的方式。按照 HTTP 规范，该参数要大写；否则某些浏览器（如火狐）可能无法处理请求；第二个参数是请求页面的 URL，即当前页面的请求应该由哪个页面来进行处理，如果需要传递参数时，在 url 后跟上相应的参数；第三个参数为请求是否为异步模式，如果是 true，js 函数将继续执行，而不等待服务器响应。 1.3 服务器响应 # 上面的代码第 4 行有一个 onreadystatechange，该方法是用来指定由哪个函数来处理服务器返回的数据（注意，被指定的函数后面不带括号，只有函数名）；当然，我们也可以直接将处理代码写在 onreadystatechange 后面，handle()具体的实现方式如下：function handle() { if (httpRequest.readyState == 4) { if (httpRequest.status == 200) { var xml = httpRequest.responseText; alert(xml); } } } 看上面的代码，首先要检查请求的状态。只有当一个完整的服务器响应已经收到了，函数才可以处理该响应。httpRequest 提供了 readyState 属性来对服务器响应进行判断。readyState 的取值如下：0（未初始化），1（正在装载），2（装载完毕），3（交互中），4（完成）。只有当 readyState==4 时，一个完整的服务器响应已经收到了，函数才可以处理该响应。 1.4 处理服务器返回数据 # 从服务器返回的数据可以简单的是一个数字、字符或字符串，也可以是某些复杂的数据类型，如 xml,json 等。对于这些我们应当分开来进行处理。下面我们来看一个完整的例子。第一个文件，我们叫 index.html: upfile aa 中国 123 var httpRequest; //创建httpRequest对象 function createHttpRequest() { if (window.XMLHttpRequest) { httpRequest = new XMLHttpRequest(); } else { httpRequest = new ActiveObject("Microsoft.XMLHTTP"); } } //向服务器发送请求 function sendRequest(s) { createHttpRequest(); httpRequest.open("GET", "test.php?s=" + s, true); httpRequest.onreadystatechange = handle; httpRequest.send(null); } //处理数据 function handle() { if (httpRequest.readyState == 4) { var text = httpRequest.responseText; document.getElementById("ss").innerHTML = text; } } 第二个文件，我们叫 test.php:

2013年的希冀 不知不觉2013年就这样到来了，我的大学生活就剩下半年的时间了。想想刚进入大学时的懵懂小孩，想想那时的雄心壮志，怀念当初时的我，可是已经永远的回不去了。马上就要毕业了，看着身边的同学都一个个地找到了工作，可是我的还是一点的音信也没有。在2012年的整年里，还算是勉强的能过得去，努力地学习php，想要在北京找一份好的工作，不过这个愿望要在2013年实现了。回首2012： 这一年依然是孤身一人； php又学的更多了，不过依然在自学； 能更加的约束自己了； 圆满的完成大学所有的课程，无一挂科； 英语六级还是没有过； 展望2013： 祝爷爷奶奶、父母、弟弟在这一年里健康、快乐； 在北京能找到一份比较好的工作； 更努力的学习PHP； 读完3本书《程序员修炼之道》、《黑客与画家》、《软件随想录》，并能很好的领略； 好好地逛一逛北京的名胜； 学习一些.net基础； 经常看算法，每个星期做几个ACM题； 顺利的毕业； 平平安安、快快乐乐过完整个2013. ╭︿︿︿╮ {/ o o /} ( (oo) ) ︶ ︶︶

jQuery随笔 这两天在看jQuery，就记下一些自己曾经苦苦寻找的东西。首先就是为动态添加的元素绑定事件。比如在一个页面中，有一个空的div，由于某种原因，我们使用js为该div添加了内容，我们需要为刚添加的内容里某个元素添加事件，比如一个按钮，$('#sub').click(function(){//事件})或者$('#sub').bind('click', function(){//事件})，这样是不行的，这种写法只能为已经加载的元素绑定事件，动态添加的是无法绑定的。不过jQuery已经为我们想好了，.live可以为任何时候添加的元素绑定事件。.live() 方法能对一个还没有添加进DOM的元素有效，是由于使用了事件委托：绑定在祖先元素上的事件处理函数可以对在后代上触发的事件作出回应。传递给 .live() 的事件处理函数不会绑定在元素上，而是把他作为一个特殊的事件处理函数，绑定在 DOM 树的根节点上。在我们的例子中，当点击新的元素后，会依次发生下列步骤： 生成一个click事件传递给来处理 由于没有事件处理函数直接绑定在

到公司实习一个月记 不知不觉在公司实习已经一个月了，想起当时在学校慌忙找工作的状态就感觉好笑，可是那个时候是真笑不起来，周围同学该找工作的都已经找到工作了，我总不能到毕业的时候才找吧，那时候就晚了。于是就在网上乱投简历，感觉着公司还行的就投；不过最后能给面试机会的公司并不是很多，可是那次来北京是很幸运的，在北京呆的5天，正好收到了几个公司的面试通知。回到学校后收到了最后的那个公司的通知，说是可以走下一步程序了。在跟项目经理交谈的过程中，就隐约的感觉到可以进这个公司了，最后也终于心想事成，进入这家公司实习。刚进公司时都会有一个熟悉业务的过程，于是我开始看人家写过的源码，看公司的业务流程，因为中间有一个春节，上班也就没多长时间。2月底的时候发工资了，当我看见工资单的时候，吓了我一跳，我说怎么这么点的工资还要交税呢。结果跟人事部的人沟通之后才知道这是劳务费，而不是工资，劳务费超过800就要交税。靠，太坑爹了，第一次跟公司签合同也不知道这个是什么情况就签了，原来合同上的工资竟然是税前工资。最近，毕业设计的任务已经布置下来了，回家后也不能很悠闲了，每天得写200字的工作日志。不过只要好好的学、好好的做，最后一定能做出一个好的作品来。

毕业设计笔记 毕业设计做到现在已经到了 0.4 版本了，功能在一步步的完善中。0.1 版本时，只能画出一个图，还得需要用按钮来。关键是，实现的思想跟现在有些差别。当时讨论的是用贝塞尔曲线，最多也就三次，因此我就每 4 个点一组画三次贝塞尔曲线，可是这样的话，最后总会剩下几个点组不成三次贝塞尔曲线，因此还得用到一次和二次。下面是就是 0.1 版本画出的图形讨论之后说这样的图形不行，这不是拟合曲线。当时我就郁闷了，按照我的程序，所有的红线都是拟合出来的，直线也是拟合的一次贝塞尔曲线。人家说不行那就接着找别的法子吧。无意间看见了一篇文章：http://blog.csdn.net/microchenhong/article/details/6316332 。这篇文章给了我很大的启发，对啊，为什么不穿过已知点呢，这样整体都是平滑的曲线了，也不用考虑最后剩余的点数，于是就出了 0.2 版本。在 0.2 版本中，实现的思路是这位作者的思路；经过自己的改进后，能够简要的满足了自己的需求。这个版本中，可以任意的点点，坐标任意、个数任意，当想让图形封闭时，只需要把最后的‘点’点在第一个点的范围内，封闭图形就构成了；这时候程序就开始计算三次贝塞尔曲线，并画在画布上。而且已经可以在画布上画出多个封闭图形了，不再需要按钮来控制图形是否要封闭，这是这个版本最大的进步。在 0.3 版本中，实现了画起点和终点。这个时候的代码还没有重构，还是非常的乱，一堆东西都写在一块了，比如判定哪个点是第一个点，什么时候图形要封闭了，等等。而且画起点和终点是有两个问题是需要考虑的：（1）如何判定当前要画的是起点和终点，而不是拟合曲线的点；（2）如何判定只能在画布上画一个起点和终点。这两个问题在 0.3 版本中并没有很好的实现，我是用全局变量进行控制的。现在已经发展到 0.4 版本中了，在 0.3 版本中的两个问题这里还没有很好的解决，还有就是 0.4 版本还没有写完，现在已经在 0.3 的基础上了实现了能够存储拟合曲线上的点，只是不很准确，因为存储的点是用函数计算出来的，而曲线是用库函数画出来的，多少有点微小的误差。先努力完善一下 0.4 版本。