PAINFUL Bug: Widget Tabs IE7

PAINFUL Bug: Widget Tabs IE7


I spent many hours tracking this very weird problem with jQuery UI
Tabs widget, which is only happening on IE7, when you create elements
dynamically, especially the tabs part containing the hyperlinks with
the "href" attribute. I find that the IE7 prepend the URL to the value
of the "href" attribute, before the pound sign.
After you execute the ".tabs()" code, the "href" attribute change to
something like "#ui-tabs-15" with the tab's label containing
"<em>Loading..</em>".
Screenshot of "alert()", after dynamically creating elements:
http://www.williamchang.org/debug/jquery_ui_widget_tabs_ie7_bug1.jpg
Screenshot of "alert()", after executing the ".tabs()" code:
http://www.williamchang.org/debug/jquery_ui_widget_tabs_ie7_bug2.jpg
How it could be fixed:
// Get id after the location hash (aka pound sign or anchor).
var strHref = $('*[href]', eleTabs).eq(0).attr('href');
var intCharacterIndex = strHref.lastIndexOf('#') + 1;
strPanelsId = strHref.substring(intCharacterIndex, strHref.length);
Sincerely,
William Chang