控件在jQuery模式对话框中不起作用

Question

我在ASP.net Web应用程序中使用了jquery对话框。 在其中，我有一个带有某些链接的用户控件。 当对话框处于模式模式时，链接是不可选择的。

我在这篇文章中尝试了解决方法，但对我而言不起作用。

更新资料
将讯息加入了ComponentArt论坛在这里 。 它似乎与组件艺术TabStrip控件有关。 此处的链接无法正常工作，但可以在Tabstrip外部使用。 请参阅下面添加的标记：

        var dlg = $("#dialog-form").dialog({
            autoOpen: false,
            height: 650,
            width: 700,
            modal: true,
            buttons: {

                close: function () {
                    $(this).dialog("close");
                }
            }
        });

        dlg.parent().appendTo($('form:first'));

<div id="dialog-form" title="">
<ComponentArt:tabstrip runat="server"
                          CssClass="TopGroup"
                          SiteMapXmlFile="../UserControls/AppDetailsTabData.xml"
                          DefaultItemLookId="DefaultTabLook"
                          DefaultSelectedItemLookId="SelectedTabLook"
                          DefaultDisabledItemLookId="DisabledTabLook"
                          DefaultGroupTabSpacing="1"
                          ImagesBaseUrl="../App_Themes/Default/Tab/images/"
                          MultiPageId="MultiPage1"
                          runat="server">
    <ItemLooks>
        <ComponentArt:ItemLook LookId="DefaultTabLook" CssClass="DefaultTab" HoverCssClass="DefaultTabHover" LabelPaddingLeft="10" LabelPaddingRight="10" LabelPaddingTop="5" LabelPaddingBottom="4" LeftIconUrl="tab_left_icon.gif" RightIconUrl="tab_right_icon.gif" HoverLeftIconUrl="hover_tab_left_icon.gif" HoverRightIconUrl="hover_tab_right_icon.gif" LeftIconWidth="3" LeftIconHeight="21" RightIconWidth="3" RightIconHeight="21" />
        <ComponentArt:ItemLook LookId="SelectedTabLook" CssClass="SelectedTab" LabelPaddingLeft="10" LabelPaddingRight="10" LabelPaddingTop="4" LabelPaddingBottom="4" LeftIconUrl="selected_tab_left_icon.gif" RightIconUrl="selected_tab_right_icon.gif" LeftIconWidth="3" LeftIconHeight="21" RightIconWidth="3" RightIconHeight="21" />
    </ItemLooks>

</ComponentArt:tabstrip>

<ComponentArt:MultiPage id="MultiPage1" CssClass="MultiPage" runat="server">
    <ComponentArt:PageView CssClass="PageContent" runat="server">

        <a href="www.google.com">click me</a>

    </ComponentArt:PageView>

    <ComponentArt:PageView CssClass="PageContent" runat="server">

    </ComponentArt:PageView>

</ComponentArt:MultiPage>

Answer 1

摆脱了组件艺术的控制，使自己的控制变得简单得多，并且可以与他人很好地玩耍。

Answer 2

首先，控件的包装div <div id="dialog-form" title="">没有结束标记</div>但是这里可能是错字，无论如何再次检查以确保结束标记</div>不丢失。

但是在这个dlg.parent().appendTo($('form:first')); 您要添加<div id="dialog-form" title=""> which is dlg的parent container ， <div id="dialog-form" title=""> which is dlg不是dlg本身<div id="dialog-form" title=""> which is dlg ，而且我没有看到<div id="dialog-form" title="">任何父包装器您代码中的<div id="dialog-form" title=""> ，所以可能是一个问题。 在您的代码中，以下行表示

`dlg.parent().appendTo($('form:first'));`

追加dlg的父级或将此（ <div id="dialog-form" title=""> ）div的父级div追加到页面的第一个表单中。

如果要在第一个表单中附加引用<div id="dialog-form" title="">的dlg ，则应编写

dlg.appendTo($('form:first'));

要么

$('form:first').append(dlg);

要么

$($('form')[0]).append(dlg);

Answer 3

我想这应该是您的答案。 请参阅模式选项说明。 它禁用其他元素，并在超链接或其他表单元素上创建图层。 该层阻止链接工作。

http://jqueryui.com/demos/dialog/#modal-message