Question

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

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

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

Answer 1

所以基本上你想创建一个动态表并访问每个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
   }
}

Answer 2

创建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/

Answer 3

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

Answer 4

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

访问该数据

$（ '＃table_cell_div'）的数据（ '信息'）;

但是这个函数只有在

之前创建DOM时才有效

（文档）$。就绪（）;

即JS创建的文档元素无法在jQuery的data()函数中访问

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

$（ '＃table_cell_div'）ATTR（ '数据信息'）;

存储和访问表格单元格内div的数据

4 个答案: