Ajax基础教程（4）- 实现基本Ajax技术 4.7 动态更新Web页面

　　删除员工与增加员工的工作是一样的。Delete按钮的onclick事件处理程序调用delete-

　　Employee函数，将员工的惟一ID传递给这个函数。此时创建一个简单的查询串，指示想做的动作（删除）和要删除的员工记录的惟一ID。XMLHttpRequest对象的onreadystatechange属性设置为所需的事件处理程序后，提交请求。

　　EmployeeListServlet servlet使用deleteEmployee方法来处理员工删除用例。这个例子做了简化，在此假设还有另一个方法处理数据库删除的具体细节。如果成功地完成了数据库删除，deleteEmployee方法会准备XML串，返回给浏览器。与员工增加用例类似，这个用例向浏览器返回一个状态码。一旦创建XML串，则将XML串通过响应对象的输出流写回到浏览器。

　　浏览器通过handleDeleteStateChange函数处理服务器响应，如果响应成功，将转发到deleteEmployeeFromList方法。deleteEmployeeFromList函数从XML响应获取状态码，如果状态码指示删除不成功，这个函数将立即退出。假设成功地完成了删除操作，这个函数则会继续，使用document.getElementById方法获取表示所删除信息的表行，然后使用表体的removeChild方法从中删除这一行。

　　为什么不使用setattribute方法来设置DELETE按钮的事件处理程序？

　　你可能已经注意到，设置Delete按钮的事件处理程序时采用了何种方法。你可能认为，设置Delete按钮的onclick事件处理程序的代码应该如下所示：

　　确实，这个代码从理论上是对的，它遵循W3C标准，而且在大多数当前浏览器中都可行，只有IE例外。幸运的是，对于IE也有一个解决办法，它可以在Firefox、Opera、Safari和Konqueror中适用。

　　这种解决办法是使用点记法引用Delete按钮的onclick事件处理程序，然后使用调用deleteEmployee函数的匿名函数来设置事件处理程序。

　　图4-14显示了实际运行的动态更新例子。

　　图4-14 每次点击Add按钮时每个姓名动态增加到列表中，而不必每次都刷新页面

　　查看全套Ajax基础教程。