Javascript 如何在单击链接时显示jquery对话框

我想在单击导航菜单中的特定链接时，弹出一个带有确认信息的jquery。我有下面的代码，但弹出窗口不显示，但弹出窗口上的信息显示在页面上以及其他页面内容上

HTML链接

对话框内容

<div id="dialog-confirm"> 
<div class="message">UI Content goes here</div> 
<div class="buttons"> 
</div> 

UI内容在这里

jquery

 <script>
 $( function() {
 $( "#dialog-confirm" ).dialog({
   $( "#order").click({  
  resizable: true,
  height: "auto",
  width: 600,
  modal: true,
  buttons: {
    "Yes": function() {
      window.location.replace("https://link_here");
    },
    No: function() {
      window.location.replace("https://link_here");
    }
  }
});
});
} );

$（函数（）{
$（“#对话框确认”）。对话框({
$（“#订单”）。单击（{
可调整大小：正确，
高度：“自动”，
宽度：600，
莫代尔：是的，
按钮：{
“是”：函数（）{
window.location.replace（“https://link_here");
},
否：函数（）{
window.location.replace（“https://link_here");
}
}
});
});
} );

当我删除

$（“#order”）。单击（{

jquery的一部分，它会作为每个单击链接的弹出窗口，因此问题必须存在，但我无法解决。

1）首先将

自动打开：false

添加到对话框设置中，这样在页面加载时弹出窗口不会自动显示

2） 在将显示弹出窗口的链接上添加click方法

看这把小提琴：

---

在单击之前，您具有调用对话框功能 请检查下面的代码

$（函数（）{
$（“#顺序”）。单击（函数（e）{
e、 预防默认值（）；
$（“#对话框确认”）。对话框({
可调整大小：正确，
高度：“自动”，
宽度：600，
莫代尔：是的，
按钮：{
“是”：函数（）{
window.location.replace（“https://link_here");
},
否：函数（）{
window.location.replace（“https://link_here");
}
}
});
})
})

UI内容在这里

您使用的是引导或jquery UI吗？我使用的是jquery UI为什么在对话框的属性中绑定了点击？这是一个语法错误，因此当您删除它时，它会起作用。如果您希望它在点击时显示，您应该在点击中初始化对话框。…

…on（“点击”，函数（）{/*对话框代码*/}）

或调用使其出现的方法。。。。