我有一个包含一组jQuery选项卡的页面.所有选项卡都指向同一个目标div,但是通过ajax加载不同的内容.当我执行初始整页加载时,我需要根据各种因素设置不同的活动选项卡.目标div中的内容已经在服务器上为此初始加载设置,因此我不需要单击选项卡,我只需要将正确的选项卡设置为“选中”.我已经尝试将相关“li”html元素的类设置为“ui-tabs-selected”.这具有初始期望的效果,但是一旦加载页面然后在选择另一个选项卡时,预选的选项卡不会关闭,从而选择两个选项卡.
那么,有没有人知道预选一个标签的替代方法(不会导致它被点击),或者是我所看到的奇怪的“ui-tabs-selected”行为的解决方案.
谢谢.
<script type="text/javascript"> $(function() { $("#panelTabs").tabs({ ajaxOptions: { error: function(xhr,status,index,anchor) { $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible."); } } }); $("#panelTabs").tabs({ select: function(event,ui) { getPage('hps.aspx?cmd=zz_' + ui.tab.id,'panelA'); } }); }); </script>
以及构建UL的C#片段:
StringBuilder tabsLiteral = new StringBuilder(); tabsLiteral.Append("<ul>"); foreach (KeyValuePair<string,Tab> kvp in tabs) { tabsLiteral.Append("<li>"); // Note - the kvp.Value.URI determines what should happen when the Tab is clicked tabsLiteral.Append("<a id=\"" + kvp.Value.URI + "\" href=\"#panelTabs\">" + kvp.Value.Caption + "</a>"); tabsLiteral.Append("</li>"); } tabsLiteral.Append("</ul>"); _panelTabs.Controls.Add(new LiteralControl(tabsLiteral.ToString())); HtmlGenericControl ctl = new HtmlGenericControl(); StringBuilder html = new StringBuilder(); html.Append("<script type=\"text/javascript\">"); html.Append("$(\"#panelTabs\").tabs({selected: 2});"); html.Append("</script>"); ctl.InnerHtml = html.ToString(); _panelTabs.Controls.Add(ctl);
另一个版本:
StringBuilder tabsLiteral = new StringBuilder(); tabsLiteral.Append("<ul>"); foreach (KeyValuePair<string,Tab> kvp in tabs) { string active = ""; if (currentTabCaption == kvp.Value.Caption) { //active = " class=\"ui-tabs-selected\""; } tabsLiteral.Append("<li" + active + ">"); // Note - the kvp.Value.URI determines what should happen when the Tab is clicked tabsLiteral.Append("<a id=\"" + kvp.Value.URI + "\" href=\"#panelTabs\">" + kvp.Value.Caption + "</a>"); tabsLiteral.Append("</li>"); } tabsLiteral.Append("</ul>"); _panelTabs.Controls.Add(new LiteralControl(tabsLiteral.ToString())); HtmlGenericControl ctl = new HtmlGenericControl(); StringBuilder html = new StringBuilder(); html.Append("<script type=\"text/javascript\">"); //html.Append("$(\"#panelTabs\").tabs('option','selected',2);"); html.Append(@"$(function() { alert('initialising tabs'); $(""#panelTabs"").tabs({ ajaxOptions: { error: function(xhr,anchor) { $(anchor.hash).html(""Couldn't load this tab. We'll try to fix this as soon as possible.""); } },select: function(event,ui) { getPage('hps.aspx?cmd=zz_' + ui.tab.id,'panelA'); } }); });"); html.Append("$(\"#panelTabs\").tabs({selected: 2});"); html.Append("</script>"); ctl.InnerHtml = html.ToString(); //_panelTabs.Controls.Add(ctl); Page.Controls.Add(ctl);