如果存在超過x個元素，則將其除以並附加超過另一個div的值

$(document).ready(function(){ 
    var unique_price = $(".price_value").get() 
    var number_price = unique_price.length; 
    if (number_price >=7){ 
     $(".price_list").each(function(index) { 
     $(".price_value_left").append($(".price_value:eq(0)"),$(".price_value:eq(1)"),$(".price_value:eq(2)"),$(".price_value:eq(3)"),$(".price_value:eq(4)")); 
     $(".price_value_right").append($(".price_value:eq(5)"),$(".price_value:eq(6)"),$(".price_value:eq(7)"),$(".price_value:eq(8)"),$(".price_value:eq(9)")); 
     });      
    } else if (number_price >9){ 
     $(".price_list").each(function(index) { 
     $(".price_value_left").append($(".price_value:eq(0)"),$(".price_value:eq(1)"),$(".price_value:eq(2)"),$(".price_value:eq(3)"),$(".price_value:eq(4)"),$(".price_value:eq(5)"),$(".price_value:eq(6)")); 
     $(".price_value_right").append($(".price_value:eq(7)"),$(".price_value:eq(8)"),$(".price_value:eq(9)"),$(".price_value:eq(10)"),$(".price_value:eq(11)"),$(".price_value:eq(12)")); 
     });  
    } 
    else { 

      $(".price_value_left").append($(".price_value:eq(0)"),$(".price_value:eq(1)"),$(".price_value:eq(2)"),$(".price_value:eq(3)"),$(".price_value:eq(4)"),$(".price_value:eq(5)"),$(".price_value:eq(6)")); 
    }

}）;如果存在超過x個元素，則將其除以並附加超過另一個div的值

我有一些菜單裏面有一些項目（'li'）。我做了這段代碼。如果div中有相同或多於7個元素，我會得到其他元素並放入另一個元素中。浮動與應擴大功能應解決，但我不能這樣做，因爲有垂直秩序，我需要維護。

我創造了'超過9個元素'，所以他們保持更平衡 - 一種風格的事情。

但我認爲這個代碼非常醜陋，不能動態接受。

有沒有更好的方法來解決這個問題並保持均衡設計？

來源

2012-07-31 JGSilva

jQuery(function($){ 
    var unique_price = $('.price_value'); 
    if(unique_price.length > 6) { 
     var half = ceil(unique_price.length/2); // In case we have an odd number, we want more elements in the left "column", so we round to next higher number. 
     $('.price_list .price_value_left').append($('.price_value:lt(' + (half + 1) + ')'); 
     $('.price_list .price_value_right').append($('.price_value:gt(' + half + ')'); 
    } 
    else { 
     $('.price_list .price_value_left').append(unique_price); 
    } 
});

你基本上要什麼比（:gt()）和比越大下（:lt()）選擇器。遺憾的是，沒有:lte選擇器，這就是爲什麼我把那個(half + 1)那裏。我想沒有必要解釋他們做了什麼。

來源

2012-07-31 20:28:44 Kiruse

這是一個很好的答案，但不是用'ceil'與我合作，而是用'Math.ceil'代替。不知道這是我做的事情，還是不是！謝謝！ – JGSilva 2012-08-01 11:47:00

@JGSilva對不起，我其實沒有測試過。你是對的，它應該是'Math.ceil'。 ;） – Kiruse 2012-08-02 16:09:07

我不知道的平衡，但你可以使用.slice()^[docs]使用分割選擇的元素：

$('#left').append($elements.slice(0,7)); 
$('#right').append($elements.slice(7));

來源

2012-07-31 20:19:46

這很好，所以學習一些新的東西，但Derija93解決了德平衡！看一看！謝謝！ – JGSilva 2012-08-01 11:48:33

那麼，你可以使用這兩個答案中的最好的;）我真的不明白你的意思是什麼「均衡設計」。 – 2012-08-01 12:01:58

如果存在超過x個元素，則將其除以並附加超過另一個div的值

回答

相關問題