jQuery的DOM操作真是太方便了AJAX实现

最新推荐文章于 2023-06-22 22:06:58 发布

最新推荐文章于 2023-06-22 22:06:58 发布 · 151 阅读

文章标签：

#Ajax #jQuery #Java #JavaScript #浏览器 #ViewUI

javascript 专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一种使用JavaScript和AJAX结合的方法来实现动态加载描述信息的功能。通过为每个元素绑定点击事件，当用户点击时，会触发AJAX请求，传入对应的ID获取描述，并将返回的数据插入到指定位置。这种方法可以提高用户体验，减少页面初始加载的内容量。

要求：根据动态生成的列表的id作为参数获取调用ajax方法，显示相应的描述信息

1,javascript函数


$(document).ready(function() {
		$('.desc').each(function(i) {
					$(this).bind('click',function() {	 
					var id='interp-'+i;
					 $(this).find('.interp').attr({
					      'id': id
    					});
    				var sstr = "#"+id;
					$.getJSON('/local/local_edu/inner/study/praxisF.do',{'method':'getDesc','praxisId':$(this).find('.pidValue').text()},function(data) {
							$(this).find(sstr).html(data['desc']);
						});
					});

		});
	});

2,页面重复的div


	<div class="desc">
					<span class="pidValue" style="display:none;"><%=praxisId %></span>
						<span class="interp" style='cursor:pointer'>题目注释</span>
					</span>
				</div>

jQuery真是超级好用!