Jquery Fancybox插件在代碼中使用數組？

我有一個jQuery插件一個的fancybox，我知道當我使用下面的代碼工作：Jquery Fancybox插件在代碼中使用數組？

$("a#roomthumb_2237").fancybox({ 
     'href' : '#2237_Info', 
     'titleShow' : false, 
     'transitionIn' : 'elastic', 
     'transitionOut' : 'elastic' 
});

但阻止我不得不多次重複此代碼（具有不同的HREF值），我想要在for循環中運行它。

我試過的代碼是：

for (var i = 0; i < rooms_array.length; i++) { 
    var d = "#roomthumb_"+rooms_array[i] 
    $(d).fancybox({ 
     'href' : rooms_array[i]+'_Info', 
     'titleShow' : false, 
     'transitionIn' : 'elastic', 
     'transitionOut' : 'elastic' 
    }); 
};

原代碼，我從谷歌直了（很可能已經從計算器，我記不清了），但只要我嘗試把它放在循環中，我迷路了，因爲我不知道如何寫它。我認爲href行是錯誤的，但我找不到解釋如何做我需要的東西。

我不知道如何寫$（「A＃roomthumb_2237」）爲$（「A」 + d）如...

來源

2012-07-08 Ricky Payne

只是評論：每個'id'值應在頁面上是唯一的;即''（「a＃roomthumb_2237」）''永遠不需要，因爲'id =「roomthumb_2237」'應該始終是唯一的。因此，總是應該使用'$（「＃roomthumb_2237」）'，特別是因爲它是最高性能的。子選擇器當然有很大的意義（例如使用'$（「＃roomthumb_2237 img」）或'$（「＃roomthumb_2237」）。find（'img'）'）。一般來說，你應該儘量避免使用任何像'$（'a'）'這樣的基本選擇器作爲選擇器。 – 2012-07-08 18:13:17

@Jared謝謝你的信息..總是很高興認識這些東西.. – 2012-07-08 22:01:51

@jfk是否回答你的問題？在所選的答案中標記適當的答案是一個最佳實踐。 – 2012-07-08 22:34:35

我固定我自己的問題。我的循環很好，文字只有一行錯了，這是我的想法，就是：

'href' : rooms_array[i]+'_Info',

我需要的是：

'href' : '#'+rooms_array[i]+'_Info',

現在我已經注意到了，確實是顯而易見...我沒有添加選擇器。

編輯： 這是我的完整的代碼，現在的作品。注 - 我選擇隨機數我的陣列，只是爲了顯示這個想法：

var rooms_array = [2235, 2236, 2237, 2238]; 
var reposition = function(){ 
    $('#hidden_stuff').attr('display', "none"); 

    $.each(rooms_array, function(key,value){ 
     var a = '#roomthumb_'+value; 
     var b = '#chosenrate_'+value; 

     if ($(b).length) { 
      var c = $(b).offset(); 

      $(a).css({ 
       visibility:"visible", 
       top: c.top -9 + "px", 
       left: c.left + 560 + "px" 
      }) 
     } 
     else{ 
     } 

     $(a).fancybox({ 
      'href' : '#'+value+'_Info', 
      'titleShow' : false, 
      'transitionIn' : 'elastic', 
      'transitionOut' : 'elastic' 
     }); 
    }); 
};

來源

2012-07-08 19:54:12

您仍然在同一個文檔中使用'ID'選擇器來處理多個實例。這肯定不會在IE瀏覽器（它只會打開第一個。） – JFK 2012-07-08 20:12:27

我有x的圖像標籤。其中每一個都有一個唯一的ID（與從數據庫中取得的「房間類型ID」相關，這意味着每個ID都是唯一的，所以它應該仍然有效。）我剛剛檢查了我的原始問題，並意識到我做了忘記添加創建數組「room_array」的代碼行，然後fancybox代碼循環遍歷每一個這樣的代碼。 – 2012-07-09 08:37:29

是否意味着你將有不同的'$（「a＃selectorID」）。fancybox（）每個''標記的腳本？ – JFK 2012-07-09 08:54:03

爲什麼不直接設置的href類和使用類選擇器調用FancyBox？

HTML

<a href="whatever.jpg" class="fancyboxMe" id="roomthumb_2237">Anchor</a> 
<a href="whatever2.jpg" class="fancyboxMe" id="roomthumb_2233">Anchor</a>

的JavaScript

$("a.fancyboxMe").fancybox({ 
     'href' : '#2237_Info', 
     'titleShow' : false, 
     'transitionIn' : 'elastic', 
     'transitionOut' : 'elastic' 
});

來源

2012-07-08 17:49:11 Ashley

即使我這樣做了，我所有的標籤都會打開相同的元素（在您的示例代碼中，＃2237_info），是不是？我需要每個標籤在fancybox中打開不同的元素。我想使用循環的原因是不必重複多次，每個都有不同的「href：xx」行... 我不知道如何獲得行 'href' ：'＃2237_Info' 要處理爲 'href'：rooms_array [i] +'_ Info'（代碼來自my'for'循環） – 2012-07-08 19:01:48

的HTML標籤<a>的正常使用是有href屬性，所以如果你有，例如：

<a class="fancybox" href="#2237_Info">2237</a> 
<a class="fancybox" href="#2238_Info">2238</a> 
<a class="fancybox" href="#2239_Info">2239</a>

那麼你只需要我們用class="fancybox"因爲米的單一的fancybox腳本（唯一）

$("a.fancybox").fancybox({ 
     'titleShow' : false, 
     'transitionIn' : 'elastic', 
     'transitionOut' : 'elastic' 
});

公告以前entioned，你不應該在同一個文檔（IDs是唯一的）

內使用相同的ID，曾多次還要注意的是，因爲這是取自你不需要你的fancybox腳本中設置的選項href<a>標籤本身（href選項在選擇器中不作爲屬性存在時使用 - 或者 - 當您希望「強制」與選擇器不同時href。）

在另一方面，如果你不想做的是手工編寫所有的<a>元素，但是從一個陣列生成它們，然後檢查 https://stackoverflow.com/a/10093265/1055987

來源

2012-07-08 20:10:47 JFK

Jquery Fancybox插件在代碼中使用數組？

回答

相關問題