欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

ajax jquery实现页面某一个div的刷新效果

程序员文章站 2022-12-03 16:46:52
原始代码是这样的:效果截图:想要实现的效果,图片红色标记的部分,点击下拉列表,下面的复选框的值跟随下拉列表的变化而变化。首先说一下解决思路:为下拉列表添加onchange事件,然后ajax异步提交给c...

原始代码是这样的:

效果截图:

ajax jquery实现页面某一个div的刷新效果

想要实现的效果,图片红色标记的部分,点击下拉列表,下面的复选框的值跟随下拉列表的变化而变化。

首先说一下解决思路:为下拉列表添加onchange事件,然后ajax异步提交给controller,进行数据库查询,然后返回modelandview,modelandview设置的view为一个新的jsp页面,该jsp页面里面嵌套的代码为要改变的div代码。

为下拉列表添加onchange事件:

ajax jquery实现页面某一个div的刷新效果

为时间添加ajax异步刷新事件:

返回的压面直接在div中加载

提交给updateac.action:

根据下拉列表选择的值然后从数据库中进行查找该值对应的信息返回,然后渲染comp.jsp页面

comp.jsp:

现在就可以实现页面的局部刷新。

总结

到此这篇关于ajax jquery实现页面某一个div刷新效果的文章就介绍到这了,更多相关ajax jquery页面div刷新内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!

相关标签: ajax 刷新 div