jquery ui循环对话框

Question

我正在将我的代码从fancybox更改为jquery ui，但我在此代码中有一些错误：

<a class = "perfil_1"><h3>Luciana </h3></a>
<a class = "perfil_2"><h3>John</h3></a>
<a class = "perfil_3"><h3>Pedro </h3></a>

<div id="dialog_1">
<p>Lorem ipsum dolor sit amet</p>
</div>

<div id="dialog_2">
<p>Lorem ipsum dolor sit amet</p>
</div>

<div id="dialog_3">
<p>Lorem ipsum dolor sit amet</p>
</div>


  for (i = 1; i < 4; i++) {
            $('.perfil_'+i).click(function(){
                $('#dialog_'+i).dialog('open');
                return false;
            });
         };

有什么帮助吗？谢谢。

Answer 1

编辑注意您缺少.dialog()声明。 没有它，您没有创建对话框，因此无法打开。 将其称为$("dialog_" + i).dialog().dialog("open"); 有关非样式对话框示例，请参阅Js小提琴 。

为什么不为每个锚添加一个类，而不是循环遍历每个锚，给它一个索引属性使用它来循环：

<H3><a class = "perfil" index=1>Luciana </a></h3>
<H3><a class = "perfil" index=2>John</a></h3>
<H3><a class = "perfil" index=3>Pedro</a></h3>

<div id="dialog_1">
<p>Lorem ipsum dolor sit amet</p>
</div>

<div id="dialog_2">
<p>Lorem ipsum dolor sit amet</p>
</div>

<div id="dialog_3">
<p>Lorem ipsum dolor sit amet</p>
</div>


$('.perfil').live("click", function(){
    var i = this.getAttribute("index");
    $('#dialog_'+i).dialog().dialog('open');
    return false;
});

另外，如果你的代码版本没有在$(document).ready(function(){})块内运行，或者不在html的末尾，那么点击分配就有可能在元素存在之前制作，并且不会绑定到当前的锚点。 这就是为什么我倾向于使用live或delegate所以你总是保证绑定。

Answer 2

你的脚本代码错了..我觉得你忘了给'_'符号。改变它

  for (i = 1; i < 4; i++) {
            $('.perfil_'+i).click(function(){
                $('#dialog_'+i).dialog('open');
                return false;
            });
         };