jQuery - 獲取div的子類的名稱並將它們的數值相加

我正在構建基於Twitter Bootstrap的響應式網格的函數。它使用.row-fluid作爲容器，spans作爲適合行內節點。每行最多可以有12個「跨度」。jQuery - 獲取div的子類的名稱並將它們的數值相加

我希望我的函數能夠找到類.row-fluid的任何元素，找到它的子節點，取類名，從中刪除「span」（只留下一個數字）並將這些數字相加。如果結果大於12，我希望它縮小最大的數字，直到數字等於12.

聽起來很複雜，希望我沒有太多太遠。下面是我在哪裏至今：

$('.row-fluid').each(function() { 
    var spanned = $(this).children('div[class*=span]').each(function() { 
     var total = 0, nums = $(this).attr('class').match(/\d+/); 
     nums.each(function() { 
      total += this; 
     } 
     console.log(total); 
    } 
    ); 
    console.log("break"); 
} 
);

目前，這是記錄整個元素，而不是隻是讓我在一個小的損失的數字在何處我已經錯了/什麼從這裏做。有什麼建議？

編輯：結構類似於此：

<div class="row-fluid"> 
    <div class="span5"> 

    </div> 
    <div class="span4"> 


    </div> 
    <div class="span2"> 

    </div> //Function should check if the 3 above spans <= 12 
    <div class="row-fluid"> 
     <div class="span8"> //Function should see this and... 
     <div class="row-fluid"> 
      <div class="span6">Fluid 6</div> 
      <div class="span6">Fluid 6</div> 
     </div> 
     </div> 
     <div class="span6">Fluid 6</div> //...this and see that they DON'T equal 12, then subtract 2 from the bigger span so that they DO equal 12 
    </div> 
    </div> 
</div>

來源

2013-01-22 Jascination

ü可以提供樣品HTML結構與跨度把它清除掉一點？ – Fisher

@Fisher當然，看看我的編輯加評論，說明腳本希望實現的內容。 – Jascination

我要胡亂猜測，這是你想要做什麼：

$('.row-fluid').each(function(i,ele) { 
    var total = 0; 
    $(ele).children().each(function(i2, spans) { 
     if (spans.className.indexOf('span') != -1) { 
      total += parseInt(spans.className.replace(/[A-Za-z$-]/g, ""),10); 
     } 
    }); 
});

來源

2013-01-22 10:25:49 adeneo

作品，歡呼聲。你能解釋一下'（我，ele）'在這裏做什麼嗎？你不要在函數本身（也不是'i2'）中使用'i'，所以我不確定這裏傳遞了什麼。 – Jascination

'$ .each'有兩個參數，索引和元素。你必須引用索引，如果沒有別的只是去元素部分。換句話說'ele'和'span'幾乎與'this'相同，'i'和'i2'只是一個索引（循環中的一個計數器）。 – adeneo

噢，所以'each'本質上是創建一個'for'循環，'i'就是增量編號。明白了，歡呼的隊友。 – Jascination

var total = 0, nums = $(this).attr('class').match(/\d+/);

醜陋線 - 定義在單獨的行中的每個變種，因爲其更易於解析爲人類beeing;]

nums = $(this).attr('class').match(/\d+/);

這是字符串，不是數字，而是做這樣的事情：

var numString = $(this).attr('class').match(/\d+/); 
var num = parseInt(numString);

林不知道在這裏發生：

nums.each(function() {

，但沒有好，我假設......每一個功能是jQuery的元素，所以也許jQuery的對待你的NUMS如jQuery對象

total += this;

通常在每個參數函數中，'this'關鍵字是jquery選擇器的一種，這就是爲什麼你得到的元素而不是數字

我要說的是，你需要聲明外spans.each（）總變量，因爲U將得到它清除後，每次迭代+做某事這樣的：

total += num;

假設U將解析numString數量，如上所述。

來源

2013-01-22 10:24:14 Fisher

jQuery - 獲取div的子類的名稱並將它們的數值相加

回答

相關問題