使用jQuery從HTML表中檢索值？

我只是想知道什麼是最好的方式來從這個HTMl代碼使用jquery檢索當前值並將它們存儲到數組中？使用jQuery從HTML表中檢索值？

<table id="metric_summary"> 
    <tbody> 
    <tr class="editable_metrics"> 
     <td><label>DataSet:</label></td> 
     <td><input name="DataSet" value="prod"></td> 
    </tr> 

    <tr class="editable_metrics"> 
     <td><label>HostGroup:</label></td> 
     <td><input name="HostGroup" value="MONITOR"></td> 
    </tr> 

    <tr class="editable_metrics"> 
     <td><label>Host:</label></td> 
     <td><input name="Host" value="ALL"></td> 
    </tr> 

    <tr class="editable_metrics"> 
     <td><label>Class:</label></td> 
     <td><input name="Class" value="CPU"></td> 
    </tr> 

    <tr class="editable_metrics"> 
     <td><label>Object:</label></td> 
     <td><input name="Object" value="cpu"></td> 
    </tr> 

    <tr class="editable_metrics"> 
     <td><label>Metric:</label></td> 
     <td><input name="Metric" value="CapacityCPUUtilization"></td> 
    </tr>

感謝

來源

2010-06-09 Mo.

我沒有測試它，但它應該做的工作：

var Dict = {}; 
$('#metric_summary input').each(function (index, input) { 
    Dict[input.name] = input.value; 
});

編輯：如果你想存儲在一個值陣列沒有標籤，你可以這樣做：

var Values = []; 
$('.editable_metrics input').each(function (i, input) { 
    Values.push(input.value); 
});

但是你不知道哪個值是指哪個標籤。您可能要做到這一點，而不是：

var Values = []; 
$('.editable_metrics input').each(function (i, input) { 
    Values.push([ input.label, input.value ]); 
});

來源

2010-06-09 13:30:33 Alsciende

#metric_summary會給你的表，而不是行。 – ajm 2010-06-09 13:33:17

謝謝，我忘了'輸入'選擇器。 – Alsciende 2010-06-09 13:35:20

這對我來說是失敗的。傳入'each（）'的函數的第一個參數是索引，http://api.jquery.com/each/第二個是元素。所以將'（input）'修改爲'（index，input）'，代碼就可以工作。 – artlung 2010-06-09 13:49:41

我會遍歷每一行和每一解析爲label和input value我關心。請注意，如果您有重複的標籤名稱，則對象存儲將丟失值。

var arr_storage = []; // var to store as array 
var obj_storage = {}; // var to store as object 
$('#metric_summary tr').each(function(){ 
    var key = $('td label:first', this).text() 
    var value = $('td input:first', this).val(); 
    arr_storage.push([ key, value ]); 
    obj_storage[key] = value; 
});

來源

2010-06-09 13:36:56 artlung

基本上，有幾種方法可以做到這一點。基本步驟：

選擇所有的TD。
遍歷它們，將它們添加到您的對象。

有很多不同的方法可以做到這一點。沒有一個是真的錯誤或正確的，但有些可能會比其他的更好或更差。如果您需要再次訪問這些行或單元格，請考慮可以將此鏈接與網站上的其他操作鏈接的方式，或者出於性能原因如何緩存內容。

這裏是一種使用map()，這maps array-like structures to an array獲取標籤/值對象的數組，像這些情況下工作良好：

someObject = $('#metric_summary .editable_metrics td:first-child').map(function(){ 
    var $el = $(this); 
    return { 'label' : $el.find('label').html(), 'value' : $el.next().find('input').val() } 
});

或許不會非常有效，但應該讓你開始。

來源

2010-06-09 13:38:52 ajm

使用jQuery從HTML表中檢索值？

回答

相關問題