需要通过Ajax加载jQuery UI Tabs动态内容链接

I have this jQuery UI Tabs model with only 2 tabs and I need the content to load through Ajax. The problem is that these tabs are loaded inside a jQuery UI Dialog and mid is dynamic. I mean, the dialog is launched by clicking a link (which contains mid=X).

我有这个jQuery UI Tabs模型，只有2个选项卡，我需要通过Ajax加载内容。问题是这些选项卡是在jQuery UI对话框中加载的，而mid是动态的。我的意思是，通过单击链接（包含mid = X）启动对话框。

The code is something like this:

代码是这样的：

Javascript:

使用Javascript：

$('.item-movie-link').each(function() {
    $(this).parent().click(function() {
        $('#tabs-movie li a[href$=info]').attr('href', $(this).attr('href') + '&op=info');
        $('#tabs-movie li a[href$=cast]').attr('href', $(this).attr('href') + '&op=cast');

        $('#dialog-movie-info').dialog('open');
        $('#tabs-movie').tabs();

        return false;
    });
});

HTML:

HTML：

<div id="dialog-movie-info">
  <div id="tabs-movie">
    <ul>
      <li><a href="#tab-info"><img src="template/images/icon-tab-movie-info.png" alt="" />Information</a></li>
      <li><a href="#tab-cast"><img src="template/images/icon-tab-movie-cast.png" alt="" />Cast List</a></li>
    </ul>
  </div>
</div>

This works when I first click one of those .item-movie-link's, but after closing the dialog and clicking another link, it will not work, the same information will be displayed.

当我第一次单击其中一个.item-movie-link时，这是有效的，但在关闭对话框并单击另一个链接后，它将无法工作，将显示相同的信息。

How can I make this work? Maybe there's a better approach for this?

我怎样才能做到这一点？也许有更好的方法呢？

1 个解决方案

#1

My problem was fixed by destroying the jQuery UI Tabs on the close event of the jQuery UI Dialog:

通过在jQuery UI对话框的close事件上销毁jQuery UI选项卡来解决我的问题：

$('#tabs-movie').tabs('destroy');