【经典】select选中值利用Ajax获取后台数据并加载到Div中

最新推荐文章于 2022-01-03 16:58:13 发布

一见你就笑i

最新推荐文章于 2022-01-03 16:58:13 发布

阅读量4k

点赞数 3

文章标签： JavaScript ajax jQuery ajax异步

本文链接：https://blog.csdn.net/zxwu_1993/article/details/80363558

版权

本文通过示例代码展示如何利用JavaScript的Ajax技术选中特定值，并从后台获取数据，然后将数据动态加载到页面的Div元素中。

摘要由CSDN通过智能技术生成

直接上到代码，有不懂的可以留言

JavaScript代码：

function onChanges() {

		//每次获取数据前先清空div
		$("#showList").empty();
		//获取select选中的值
		var housecode = $("#searchHousecode").val();
		//进行判断 不为空进行ajax请求 否则提示没有输入
		if (housecode != null && housecode.trim() != "") {
		$.ajax({
		    type : "post",
		    data:"housecode="+housecode,
		    url : "HouseRepairController_listPage",
		    success : function(data) {
		    	//把返回的数据使用each进行遍历读取
		    	$.each(data, function(i,n){
		    		//获得div的id并把需要显示的值追加到div中
		    		$("#showList").append("<div class='repaitList'><ul><li><abbr>"+n.name+
		    				"</abbr><span class='borderRadius5 repaitListSpan1'>"
		    				+n.STATUS+"</span></li><li class='oneEllipis'>"+n.factory_na