关于 jquery ui tabs的ajax异步刷新问题

<div id="tabs" >

			<ul>

				<li><a   href=" M.action" style="font-size:18px;font-weight:bold; ">月</a></li>

				<li><a   href=" H.action" style="font-size:18px;font-weight:bold; ">季度</a></li>

				<li><a   href=" Y.action" style="font-size:18px;font-weight:bold; ">年</a></li>

			</ul>

			</div>

这是jsp页面内容  ，大致实现思路是三个选项卡 分别对应 月，季度，年。 当点击“月”选项卡的时候，异步加载页面，并且 能有个 loading提示。 当加载完毕后，loading消失。 想必很多朋友应该能理解我的意思。

var jq=$.noConflict();//使用 noConflict() 方法为 jQuery 变量$规定新的名称

	//分栏选项卡->

	jq(document).ready(function(){	

		    jq.ajaxSetup({cache:false});

		 	jq("#tabs").tabs().tabs({

		 		ajaxOptions: { async: true },//标签页异步

		 	    cache:true,	//开启缓存  

		 	    spinner: 'Loading data...' , //选项卡loading字符，没有效果。。不知道为何。。

		 		select: function(event, ui) 

		 		{//select事件

						if(ui.index==0){

						//alert("tab1");

						}

						if(ui.index==1){				

							

							}

						if(ui.index==2){

						// alert("tab3");

						}

			}

		 	}); 

		 	//$('.selector').tabs({ spinner: 'Retrieving data...' });  

	});

请问 怎么能够实现 让jquery ui tabs支持  点击选项卡 loading ，然后加载完毕页面 ，loading取消这种效果呢。。。

请大神们指教  万分感谢！
------解决方案--------------------

The spinner option is being removed. See  

$(document).ready(function () {

           var $tabs = $("#tabs").tabs({ 

                                

                                alignment: "top",

                                spinner : false,

                                ajaxOptions: {

                                    error: function( xhr, status, index, anchor ) {

                                                    $( anchor.hash ).html( "Couldn't load this tab. Please try again.");