JavaScript 클릭 한 행의 데이터 가져 오기

안녕하세요, 사용자가 클릭 한 행의 모든 데이터를 가져와서이 스크립트를 시도했지만 행 ID를 가져 오지만 데이터가 존재하지 않습니다. 해당 행은 내가 더 용도로 배열에 해당 행의 모든 데이터를 푸시 : 당신은 클릭 처리기를 바인딩 후 루프 쓰루, 그것을 시도하는 동안, 행을 클릭JavaScript 클릭 한 행의 데이터 가져 오기

function findRowNumber() { 
    var rowIdx; 
    var rowData = new Array(); 
    var table = document.getElementById('product_table'); 
    var rows = table.getElementsByTagName('tr'); 
    var selectedRow; 
    var rowCellValue; 
    for (i = 0; i < rows.length; i++) { 
     rows[i].onclick = function() { 
      rowIdx = this.rowIndex; 
      selectedRow = rows[rowIdx]; 
      for (j = 1; j < selectedRow.length; j++) { // it doesn't enter that loop 
     rowCellValue = selectedRow.cells[j].value; 
     rowData.push(rowCellValue); 
     alert("Value " + rowCellValue); 

    } 
     } 
    } 


}

출처

2013-03-06 Java Player

selectedRow이 후 채워집니다하지만 이전 실제 클릭. 당신은 셀의 데이터가 텍스트 인 경우

이는 TextContent (또는 innerText와) 함께 검색하는 것이 더 간단 할 수있다, 클릭 처리기에

출처

2013-03-06 14:09:29

은 내가 클릭 처리기에 루프를 이동하지만 아무것도 경고를 같아요 –

@Eslam이 rowIndex에 정의되지 않은 값을 얻을하지 않습니다 아직 변경되지 않습니다 :) –

을 그 코드를 이동해야합니다.

<!doctype html> 
<html lang= "en"> 
<head> 
<meta charset= "utf-8"> 
<title> Small Test Page</title> 
<style> 
table{border:3px ridge #c0c0c0;border-collapse:collapse;} 
th, td{border:1px solid black} 
</style> 

<script>  
function findRowNumber(){ 
    var rowIdx; 
    var rowData= []; 
    var table= document.getElementById('product_table'); 
    var rows= table.getElementsByTagName('tr'); 
    var selectedRow; 
    var rowCellValue; 
    for(i= 0;i<rows.length;i++){ 
     rows[i].onclick= function(){ 
      rowIdx= this.rowIndex; 
      selectedRow= this.cells; 
      for(j= 0;j<selectedRow.length;j++){ 
       rowCellValue= selectedRow[j].textContent || 
       selectedRow[j].innerText; 
       rowData.push('cell '+j+': '+rowCellValue); 
      } 
      alert("Row #" +rowIdx+'. '+ rowData); 
     } 
    } 
}  
</script> 
</head> 
<body> 
<h1> Retrieve Row Data</h1> 
<p> <button type= "button" id= "tableSwapBtn" onclick= "findRowNumber()"> 
Click to initialize</button> </p> 

<table id="product_table" style="width:300px"> 
<tbody> 
<tr> <td> a</td> <td> 1</td> </tr> 
<tr> <td> b</td> <td> 2</td> </tr> 
<tr> <td> c</td> <td> 3</td> </tr> 
<tr> <td> d</td> <td> 4</td> </tr> 
<tr> <td> e</td> <td> 5</td> </tr> 
<tr> <td> f</td> <td> 6</td> </tr> 
<tr> <td> g</td> <td> 7</td> </tr> 
</tbody> 
</table> 
</body> 
</html>

출처

2013-03-06 14:59:30 kennebec

JavaScript 클릭 한 행의 데이터 가져 오기

답변

관련 문제