jquery - 如何通过 rel 属性打开模态对话框

Question

我是 jscript 和 jquery 的新手。我正在创建一个网站，该网站需要在单击超链接时打开模式对话框。

在示例代码（来自网站）中，我看到它使用的是这样的：

<a id="SendToFriend" class="button send" href="#modalTellAFriend" rel="modal" data-closetext="Close">

content=jQuery(div#modalTellAFriend)closetext="Fermer"
<span>Send</span>
</a>

所以，基本上，我可以添加这样的：

<div id="first modal">
</div>

<div id="second modal">
</div>

现在，简单的 qn，我如何编写 jQuery 函数来实现这一点？我也想对模态屏幕使用 validate 和 form

Answer 1

您可以使用 jQuery UI 库来创建模态对话框http://jqueryui.com/demos/dialog/#modal

可以像这样为不同的 rel 属性打开不同的对话框：

$('a[rel="modal_1"]').click(function(){
  $( "#first_modal" ).dialog({
    closeText : 'Fermer',
    modal: true
  });
});

$('a[rel="modal_2"]').click(function(){
  $( "#second_modal" ).dialog({
    closeText : 'Fermer',
    modal: true
  });
});