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 fiddle以獲取非風格的對話示例。

而是通過每個循環你爲什麼不添加一個類每個錨，給它一個索引的屬性用它來遍歷：

<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

腳本代碼wrong..i以爲你忘了.change，鑑於「_」符號

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