同一个按钮打开对话框的许多副本

Lots of copies of the same button opening dialog

本文关键字：许多 副本 打开对话框 按钮 同一个      更新时间：2023-09-26

我最近第一次使用JQuery，遇到了问题。我有很多打开对话框的同一个锚的副本，问题是当我点击其中任何一个时，对话框打开的副本与锚的副本一样多。

代码看起来像这个

脚本：

$(document).ready(function(){
    $('div#dialogbox').dialog({
        autoOpen: false
    });
    $('#opener').click(function(){
        $('div#dialogbox').dialog('open);
    });
});

对话框：

<div id="dialogbox">
    <p>Sample text</p>
</div>

锚：

<a href="#" id="opener">Click Me</a>

尝试用类似的东西替换它

<a href="#" class="opener">Click Me</a>

和你的JS到

$(document).ready(function(){
    var popup = $('div#dialogbox').dialog({autoOpen: false});
    $('.opener').click(function(){
        popup.dialog('open);
    });
});

在相同名称的页面上只能有一个ID，如果需要多个ID，那么应该使用一个类。

您可以尝试

var popup;
$(document).ready(function(){
popup =  $('div#dialogbox').dialog({
autoOpen: false});
$('.opener').click(function(){ popup.dialog('open); });
});

如果这解决了你的问题，那么你会想遵循var的一些最佳实践，但只是一些快速的东西，看看它是否解决了问题

也会遵循其他答案中的其他建议，从id改为class，请注意，如果这是你的问题，但你不应该有多个具有相同值的id

<a href="#" class="opener">Click Me</a>

此外，请确保页面上只有一个弹出窗口的副本

相关文章：