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

jquery实现post异步请求

程序员文章站 2022-07-12 21:00:25
...

1.语法 jQuery.post(url,data,success(data, textStatus, jqXHR),dataType)

$("#vkmid").change(function(){
	var url = $url = $(this).data('url');
	var mid = $(this).val();
	$.post(url,{mid:mid},function(rs){
		var data = rs.category;
		var data1 = rs.controllist;
		if(data)
		{
			jQuery("#catid").empty();
			// alert(data.length);
			if(data.length > 0)
			{
				// jQuery("<option value=0>请选择</option>").appendTo(jQuery("#catid"));
				jQuery("<option value=0>选择栏目</option>").appendTo(jQuery("#catid"));
				jQuery.each(data,function(idx,item)
				{
					jQuery("<option value="+item.cid+">"+item.cid+" | "+item.cname+" | "+item.ccaption+"</option>").appendTo(jQuery("#catid"));
				});				
			}
			else
			{
				jQuery("<option value=0>无栏目</option>").appendTo(jQuery("#catid"));
			}
		}
		else
		{
			jQuery("#catid").empty();
			jQuery("<option value='0'>请选择</option>").appendTo(jQuery("#catid"));
		}


		if(data1)
		{
			jQuery("#conid").empty();
			// alert(data1.length);
			if(data1.length > 0)
			{
				// jQuery("<option value=0>请选择</option>").appendTo(jQuery("#conid"));
				jQuery("<option value=0>选择功能</option>").appendTo(jQuery("#conid"));
				jQuery.each(data1,function(idx,item)
				{
					jQuery("<option value="+item.cid+">"+item.cid+" | "+item.cname+" | "+item.ccaption+"</option>").appendTo(jQuery("#conid"));
				});				
			}
			else
			{
				jQuery("<option value=0>无功能</option>").appendTo(jQuery("#conid"));
			}
		}
		else
		{
			jQuery("<option value='0'>请选择</option>").appendTo(jQuery("#conid"));
		}
			})
		})
})

核心思想:post带参数请求url地址,返回过来一个json的对象,获取容器父级的id,通过删除元素里面的内容再动态拼接来实现局部刷新。


相关标签: jquery 异步