jQuery Dialog - 来自不同链接的相同对话框答案

【问题标题】：jQuery Dialog - same dialog from different linksjQuery Dialog - 来自不同链接的相同对话框
【发布时间】：2012-08-08 00:28:38
【问题描述】：

我在实施 here 几天以来遇到的问题时遇到了麻烦，所以我试图想出一个替代方案来实现同样的目标。我决定不对表单使用外部文件，而是在我的 html 文件内部使用它。我现在遇到的问题是对话框只显示包 1 而不是包 2。

代码：

<script type="text/javascript">
    $('#PackageBook').dialog({
        autoOpen: false,
        width: 500,
        height: 400
    });

    $('#PackageBookOpen').click(function(){
        $('#PackageBook').dialog('open');
        return false;
    });
</script>
<body>
    <div id="Package1" class="packageDialog">
        <div id="order">
            <a id="PackageBookOpen" title="Package Booking" class="ui-state-default ui-corner-all" href="#"><img src="images/order.png"></a>
        </div>
    </div>
    <div id="Package2" class="packageDialog">
        <div id="order">
            <a id="PackageBookOpen" title="Package Booking" class="ui-state-default ui-corner-all" href="#"><img src="images/order.png"></a>
        </div>
    </div>
    <div id="PackageBook" class="packageBookDialog" title="Package Booking">
        <form name="package" action="">
               //Form 
        </form>
    </div>
</body>

【问题讨论】：

ID 必须是唯一的。你重复使用了id="PackageBookOpen"

标签： jquery jquery-ui-dialog

【解决方案1】：

您不能拥有多个相同的 ID。改用类选择器，例如

 $('.packageBookOpen').click(function(){
        $('#PackageBook').dialog('open');
        return false;
    });

并将类 packageBookOpen 添加到适当的元素中。

【讨论】：

我在将 PackageBook 作为 ID 时也遇到了一些问题，但是将其更改为一个类解决了我的问题。谢谢！
奇怪的是 PackageBook id 有什么问题？