使用对象使用jQuery访问表单元格

时间:2018-01-09 11:45:07

标签: javascript jquery html-table cell

我需要在多维数组中复制表格的单元格。 我尝试以下代码:

function tableManager ( table, rowitems ) {
    var items = array () ;

    var j = 0 ;
    var arow = array() ;
    $(table+' td').each(function() {
        arow[j] = $(this).html() ;
        j ++ ;
        if ( j == rowitems) {
            items.push(arow);
            j = 0 ;
        } ;
   }) ;

    this.show = function() {
    .............
    }
}

构造函数是:

$(document).ready(function(){
    var loadarr = new tableManager ( '#results', 4 ) ;
    ....
});

似乎没有执行each()回调。

什么是错误的?

3 个答案:

答案 0 :(得分:0)

tableManager是一个函数,您不必使用“new”构造它。您必须将其称为以下内容:

$(document).ready(function(){
    var loadarr = tableManager('#results', 4);
    ...
});

另外,你有一个“;”在你的“if(...){..}”之后。你必须删除它:

if ( j == rowitems) {
        items.push(arow);
        j = 0 ;
    } ; <= REMOVE THIS

此处有更多详情:https://www.w3schools.com/js/js_function_definition.asp

安德烈

答案 1 :(得分:0)

如果问题是:

  

似乎不执行each()回调。

这是因为tableManager是一个函数,你必须通过以下方式调用它:

var loadarr = tableManager ( '#results', 4 ) ;

有关详细信息,请访问W3Schools

此外,删除;

的右括号后的if ( j == rowitems)
if ( j == rowitems) {
    items.push(arow);
    j = 0 ;
} // Removed ;

<强>更新

如果未达到each方法,请尝试了解发生了什么。尝试使用

console.log($(table+' td'));

each方法之前,后者因为没有元素而没有执行。

console.log($(table+' td'));
$(table+' td').each(function() {
    arow[j] = $(this).html() ;
    ...

然后你可以在你的参数函数中添加console.log("Each executed")以确保它被执行:

$(table+' td').each(function() {
    console.log("Each executed");

    arow[j] = $(this).html() ;
    j ++ ;
    if ( j == rowitems) {
        items.push(arow);
        j = 0 ;
    }
}) ;

答案 2 :(得分:0)

您的jquery功能不正确请参阅此处的工作代码

    <!DOCTYPE html>
    <html>
    <head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <style>
    table {
        font-family: arial, sans-serif;
        border-collapse: collapse;
        width: 100%;
    }

    td, th {
        border: 1px solid #dddddd;
        text-align: left;
        padding: 8px;
    }

    tr:nth-child(even) {
        background-color: #dddddd;
    }
    </style>
    </head>
    <body>

    <table id="results">
      <tr>
        <th>Company</th>
        <th>Contact</th>
        <th>Country</th>
      </tr>
      <tr>
        <td>Alfreds Futterkiste</td>
        <td>Maria Anders</td>
        <td>Germany</td>
      </tr>
      <tr>
        <td>Centro comercial Moctezuma</td>
        <td>Francisco Chang</td>
        <td>Mexico</td>
      </tr>
      <tr>
        <td>Ernst Handel</td>
        <td>Roland Mendel</td>
        <td>Austria</td>
      </tr>
      <tr>
        <td>Island Trading</td>
        <td>Helen Bennett</td>
        <td>UK</td>
      </tr>
      <tr>
        <td>Laughing Bacchus Winecellars</td>
        <td>Yoshi Tannamuri</td>
        <td>Canada</td>
      </tr>
      <tr>
        <td>Magazzini Alimentari Riuniti</td>
        <td>Giovanni Rovelli</td>
        <td>Italy</td>
      </tr>
    </table>

    </body>

    <script type="text/javascript">
      function tableManager ( table, rowitems ) {
                var items = [] ;

                $(table+' tr').each(function(i) {
                  var row = $(this);
                  if(rowitems == i){
                     row.find('td').each(function() {
                        console.log(this);
                        items.push($(this).html());
                     }) ; 
                  }
               });
                console.log(items);
               return items;
            }

      var itm = tableManager("#results", 4);
      console.log(itm);
    </script>
    </html>

我希望这会对你有所帮助。

相关问题