AJAX实例入门_[AJAX教程]























最后是JSP文件：

　　




　　

　　background=images/bg2.gif border=0>
　　


　　


　　




　　


　　


　　

Resource Management >> New
　　Staff


　　


　　


　　




　　


　　


　　



align=center border=0>
　　


　　


　　




　　


　　


　　

 Personal
　　Information


　　

Last
　　Modified : 06/06/2005


　　


　　


　　




　　


　　


　　



　　name="B323252">  
　　




　　


　　


　　


　　

border=0 name="DynamicTabsTable">
　　


　　


　　
　　


　　


　　


　　


　　
　　


　　

　　

Freeborders Experience

　　


　　


　　

FB Vertical Experience


　　

FB Customer
　　Experience


　　


　　


　　

 


　　


　　
　　b
　　c
　　
　　


　　


　　


　　


　　


　　


　　


　　a
　　
　　


　　




　　


　　


　　




　　onclick="selChange(document.forms[0].select26,document.forms[0].select27);changeSel(document.forms[0].select27,document.forms[0].select25,'0')" />
　　




　　


　　


　　




　　onclick="addAll(document.forms[0].select26,document.forms[0].select27);changeSel(document.forms[0].select27,document.forms[0].select25,'0')"/>
　　




　　


　　


　　








　　


　　


　　




　　onclick="selChange(document.forms[0].select27,document.forms[0].select26,document.forms[0].select25,1);changeSel(document.forms[0].select27,document.forms[0].select25,'0')"/>
　　




　　


　　


　　




　　onclick="addAll(document.forms[0].select27,document.forms[0].select26);changeSel(document.forms[0].select27,document.forms[0].select25,'0')"/>
　　




　　


　　


　　




　　

 


　　

　　style="WIDTH: 180px; HEIGHT: 120px" multiple="multiple" size="4"
　　name="select27">
　　b
　　c
　　


　　


　　




　　


　　


　　


　　

　　style="WIDTH: 180px; HEIGHT: 120px" multiple="multiple" size="4"
　　name="select28">
　　b1
　　


　　




　　


　　


　　




　　onclick="selChange(document.forms[0].select28,document.forms[0].select29);changeSel(document.forms[0].select29,document.forms[0].select30,'1')"/>
　　




　　


　　


　　




　　onclick="addAll(document.forms[0].select28,document.forms[0].select29);changeSel(document.forms[0].select29,document.forms[0].select30,'1')"/>
　　




　　


　　


　　








　　


　　


　　




　　onclick="selChange(document.forms[0].select29,document.forms[0].select28);changeSel(document.forms[0].select29,document.forms[0].select30,'1')"/>
　　




　　


　　


　　




　　onclick="addAll(document.forms[0].select29,document.forms[0].select28);changeSel(document.forms[0].select29,document.forms[0].select30,'1')"/>
　　




　　


　　


　　




　　

 


　　

　　style="WIDTH: 180px; HEIGHT: 120px" multiple="multiple" size="4"
　　name="select29">
　　b2
　　


　　


　　




　　


　　


　　




　　

 


　　


　　


　　

Project Experience


　　

SubProject
　　Experience


　　


　　


　　


　　
　　
　　b2
　　
　　


　　


　　
　　
　　b13
　　b14
　　
　　


　　


　　


　　


　　


　　


　　

　　style="WIDTH: 180px; HEIGHT: 120px" multiple="multiple" size="4"
　　name="select32">
　　b11
　　b12
　　


　　




　　


　　


　　




　　onclick="selChange(document.forms[0].select32,document.forms[0].select33);changeSel(document.forms[0].select33,document.forms[0].select31,'2')"/>
　　




　　


　　


　　




　　onclick="addAll(document.forms[0].select32,document.forms[0].select33);changeSel(document.forms[0].select33,document.forms[0].select31,'2')"/>
　　




　　


　　


　　








　　


　　


　　




　　onclick="selChange(document.forms[0].select33,document.forms[0].select32);changeSel(document.forms[0].select33,document.forms[0].select31,'2')"/>
　　




　　


　　


　　




　　onclick="addAll(document.forms[0].select33,document.forms[0].select32);changeSel(document.forms[0].select33,document.forms[0].select31,'2')"/>
　　




　　


　　


　　




　　

 


　　

　　style="WIDTH: 180px; HEIGHT: 120px" multiple="multiple" size="4"
　　name="select33">
　　b13
　　b14
　　


　　


　　




　　


　　


　　


　　

　　style="WIDTH: 180px; HEIGHT: 120px" multiple="multiple" size="4"
　　name="select34">
　　b111
　　b112
　　b113
　　


　　




　　


　　


　　




　　onclick="selChange(document.forms[0].select34,document.forms[0].select35);"/>
　　




　　


　　


　　




　　onclick="addAll(document.forms[0].select34,document.forms[0].select35)"/>
　　




　　


　　


　　








　　


　　


　　




　　onclick="selChange(document.forms[0].select35,document.forms[0].select34);"/>
　　




　　


　　


　　




　　onclick="addAll(document.forms[0].select35,document.forms[0].select34)"/>
　　




　　


　　


　　




　　

 


　　

　　style="WIDTH: 180px; HEIGHT: 120px" multiple="multiple" size="4"
　　name="select35">
　　b114
　　b115
　　b116
　　


　　


　　




　　


　　
　　




　　


　　


　　

　　


　　




　　


　　


　　




　　


　　


　　


　　


　　


　　


　　



　　name="B32">  
　　




　　


　　


　　


　　
　　


　　


　　


　　


　　

　　虽然这个JSP复杂多了，但是关于AJAX的代码还是跟前面的例子一样，在这里我也就不多说了，请大家自己看。

　　六、蛇足

　　好了，例子都说完了。废话也就不多说了，只说一件事：AJAX好像来势汹汹，要把我们用得极其普遍、极其习惯的Struts等的MVC开发模式取代掉一样。

　　其实，AJAX有它的优点，同样也有它的缺点。它一般用在用户不想等待返回结果的时候和复杂的UI上；其他时候，我们还是可以使用Struts等常规方法。

　　一句话，不要为了使用AJAX而使用AJAX，而是要在适合于使用AJAX的地方使用AJAX。

　　注：本文参考了一些网友的作品，不好列出参考文献，在此对他们的工作表示感谢！

上一页