使用jQuery遍歷html表格

我是jQuery初學者嘗試使用jQuery遍歷html表格。我經歷了與此相關的各種帖子，但沒有人能夠滿足我的問題陳述。使用jQuery遍歷html表格

所以下面是樣本HTML表：

<table> 
    <tr> 
     <td><input type="text" id="text1"></td> 
     <td> 
      <select> 
       <option value="abc">ABC</option> 
       <option value="def">DEF</option> 
      </select> 
     </td> 
    <tr> 
    <tr>..</tr> 
</table>

我會非常喜歡，形成由管這樣分開記錄的所有單元格值的字符串：mytext的內容，ABC | mytext2，DEF

嘗試以下jQuery的功能，但仍未能達到這個

$(function abc() { 
    $("#save").click(function() { 
     var dataList; 
     var recordList; 
     var i = 0; 
     $('#summaryTable tr').each(function() { 
      alert('tr found'); 
      $(this).find('td').each (function() { 
       alert('td found'); 
       var data = $(this).html(); 
      }); 
     }); 
    }); 
});

任何幫助將是great.Thanks。

來源

2013-08-03 shabeena

什麼是mytext和mytext2？ ABC mytext背後有什麼邏輯mytext2，DEF'是？ – Cherniv

@Cherniv第一個文本框的樣本值 – shabeena

這個問題與Java有什麼關係？爲什麼[tag：java]標籤？ –

[編輯]

根據你的問題，例如，TRS具有相同的結構，

那麼你需要的是這樣的：

是，如果你想要「文本字段值」，「選定值」| 「下一個TRS ..」：JSFiddle

JS代碼：

var wordVal=""; 
var totalString = ""; 
$('#btn').click(function(){ 
    totalString=""; 
    $('table tr').each(function(i){ 
     $(this).children('td').each(function(j){ 
      if(j==0) wordVal = $(this).children('input').val().trim(); 
      else totalString+= wordVal+','+$(this).children('select').val()+'|'; 
     }); 
    }); 
    totalString= totalString.substring(0,totalString.length-1); 
    console.log(totalString); 
});

JS爲（「文本字段值」 1 「選項1」代碼| 「文本字段的值」 2 「選項2」 ...等）：JSFiddle

var wordVal=""; 
var totalString = ""; 
$('#btn').click(function(){ 
    totalString = ""; 
    $('table tr').each(function(i){ 
     $(this).children('td').each(function(j){ 
      if(j==0) wordVal = $(this).children('input').val().trim(); 
      $(this).children('select').children('option').each(function(k){ 
       totalString+= wordVal+(k+1)+','+$(this).html()+'|'; 
      }); 
     }); 
     totalString= totalString.substring(0,totalString.length-1)+'\n'; 
    }); 
    console.log(totalString); 
});

來源

2013-08-03 13:25:20 CME64

Yayy！它工作。謝謝:-) – shabeena

@shabeena你歡迎:) – CME64

<label id="l1">Hello Test</label> 
<label id="l2">Hello Test22222</label> 
<input type="button" id="button1" /> 

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("#button1").click(function(){ 
    var a = $('#l1').html(); 
    $("#l1").text($('#l2').html()); 
    $('#l2').text(a); 

    }); 
}); 

</script>

來源

2013-08-03 12:34:00

l1表示什麼？ – shabeena

只有id名稱，因此任何用戶都可以使用不同的id。 –

我有很多組件，並且不想用ID屬性理想地遍歷 – shabeena

我仍然沒有得到逗號和管道，但要儘量

var objs = []; 
$("table :input").each(function(i, v) { 
    objs.push($(v).val()); 
}); 
$("#result").html(objs.join("|"));

而且here is the fiddle。

你可以自己解決它。

來源

2013-08-03 13:07:59 Clxy

var NewString = ""; 
$(".nav li > a").each(function(){ 
    NewString = NewString + "This,"+$(this).text()+"|"; 
});

來源

2013-08-03 13:12:49 Rickyrock

該算法：

$(function() { 
    $('button').click(function() { 
     alert(getString()); 
    }); 

    function getString() { 
     var rows = $('table>tbody>tr'); // all browsers always create the tbody element in DOM 
     var arr = []; 
     for (var i = 0; i < rows.length; i++) { 
      var cells = rows.eq(i).children('td'); 
      var text1 = cells.eq(0).find('input').val(); 
      var text2 = cells.eq(1).find('select').val(); 
      //var text2 = cells.eq(1).find('select option:selected').html();//alternative, if you want to collect the inner html instead 
      arr.push(text1 + ',' + text2); // add string to array 
     } 
     return arr.join('|'); // join the string in array to single string 
    } 
});

http://jsfiddle.net/T9RtQ/2/

來源

2013-08-03 15:06:32 Stano

使用jQuery遍歷html表格

回答

相關問題