jQuery UI 对话框只打开一次

Question

每个对话框只打开一次，之后什么也没有发生。我已经搜索了一段时间，这里有一些关于此的答案，但老实说我不理解它们。（我对 jQuery 和 jQuery UI 很陌生）所以如果你能给我任何帮助，那就太好了！

$('.prdDetails').click(function() {
        $(this).next('#prdDetails').dialog({
            draggable: false,
            height: 100,
            modal: true,
            resizable: false,
            width: 100
        });
        return false;
    });

感谢您的宝贵时间！

Answer 1

问题出在那一行：

$(this).next('#prdDetails').dialog({

对话框在打开后改变了它的位置，因此它不再是next()打开器。

您应该识别具有独特 id 的对话。

HTML:

<a class="prdDetails" data-dialog="#d1">Dialog 1</a>
<div id="d1" class="hidden">This Is Dialog 1</div>

<a class="prdDetails" data-dialog="#d2">Dialog 2</a>
<div id="d2" class="hidden">This Is Dialog 2</div>

<a class="prdDetails" data-dialog="#d3">Dialog 3</a>
<div id="d3" class="hidden">This Is Dialog 3</div>

脚本：

$('.prdDetails').click(function(e) {
    e.preventDefault();
    $($(this).data('dialog')).dialog({
        draggable: false,
        height: 100,
        modal: true,
        resizable: false,
        width: 100
    });
});

JSFiddle（打开控制台了解对话框发生了什么，以及为什么不能使用 next()）

jQuery UI 对话框只打开一次

jQuery UI Dialog box only opens once

jquery

jquery-ui