3

http://fiddle.jshell.net/kBFU7/2/ 在代码中,我通过jQuery创建了一个动态表。我还为每个表格单元格设置了一个 div。我希望存储和访问这个 div 的数据,例如,每个 div 的行和列。

因此,我想就如何存储这些数据提出一些建议。我已尝试按照此链接http://time2hack.blogspot.sg/2012/11/jquery-store-access-relative-info-within-HTML-element的建议为每个 div 创建一个跨度以在其中存储信息。 html#axzz2Ee3iLxCt但它似乎不合适,我无法访问回信息。

如果有人能给我一些我可以尝试的建议,我将不胜感激。

4

4 回答 4

2

所以基本上你想创建一个动态表并访问每个 TD 及其数据。为了做到这一点,您不需要任何 div 或 span 放置在这些 TD 中以访问它们的内容(如果这就是您想要的)。最简单的方法是根据它们的行和列位置为这些 TD 中的每一个分配一个 id。这样,您可以循环访问它们中的每一个,或者直接访问它们,或者不访问它们。

下面我写了一个超级简单的方法来实现它。当然,您可以根据需要对其进行自定义或增强。但是你应该明白吗?

(我正在使用你的代码来做到这一点)

$(document).ready(function() {
createTable($("#tb1"));
    function createTable(tbody){
      if (tbody == null || tbody.length < 1) return;
      for(var r=0;r<5;r++){
        var trow=$("<tr>");
        for(var c=0; c<5;c++){
            var tcol=$("<td>")
            tcol.attr("id","row"+r+"col"+c); /// assign id to each td

            var cellText = "row " +r + " col " +c 
            $("<div>")
                .text(cellText)
                .appendTo(tcol)

            tcol
                .appendTo(trow)
        }
        trow.appendTo(tbody);
      }
    }    
});

所以基本上你这样做了:

<td id="row1col1"></td>
   <td id="row1col2" ></td>

现在,每当您想访问任何单元格时,请执行此操作

$('#row1col1').text();
or
$('#row1col1').html();

您可以像这样循环访问单元格

for(var r=0;r<5;r++){
    for(var c=0;c<5;c++){

       var cellValue=   $('#row'+r+"col"+c).text() // or .html()

         makeAjaxRequest(cellValue); /// send to server or whatever
   }
}
于 2012-12-10T13:47:12.213 回答
1

创建 div 时添加唯一 ID:

.attr("id","cell-" + r+ "-" + c)

在带有输入的按钮上尝试此代码:

$("#btn").bind("click", function(){
  var r = $('#row').val();
  var c = $('#column').val();
  var data = $('#data').val();
  $('#cell-' + r + '-' + c).text(data);        
});        

在我的小提琴上试试:http: //jsfiddle.net/kBFU7/4/

于 2012-12-10T13:51:10.700 回答
0

您必须将此值作为数组传递,并且必须在后端接收它,请访问此链接 http://www.aspdotnet-suresh.com/2012/07/aspnet-save-dynamically-created-control.html

于 2012-12-10T13:40:51.267 回答
0

访问元素中的数据属性;可以有两种方法。jQuery 通过

$('#table_cell_div').data('info');

但是这个函数只有在之前创建了 DOM 时才有效

$(文档).ready();

即 JS 创建的文档元素在data()jQuery 的功能中是不可访问的

但是要在 DOM 准备好之后访问这些元素和属性;您可以通过以下代码访问该数据

$('#table_cell_div').attr('data-info');

于 2012-12-11T01:54:30.087 回答