Строки таблицы jQuery не отображаются должным образом в Firefox - PullRequest
Новая
       4

Строки таблицы jQuery не отображаются должным образом в Firefox

2 голосов
/ 07 сентября 2010

Это фрагмент кода, который я написал: 

<html>                                                                  
 <head>                                                                  
 <script type="text/javascript" src="jquery-min.js"></script>          
 <script type="text/javascript">                                         

   $(document).ready(function() {

   var rowIndex = ["A","B","C","D","E","F","G","H","I","J","K","L","N"];
   $.get("crosswords.xml",{},function(xml){

   $('crossword',xml).each(function(i) {

   if("1" == $(this).find("number").text())
   {
          $('body').append("<table border=1>");

          for(var i = 0;i < rowIndex.length;i++)
          {
              $('body').append("<tr height=25>");

              for(var j = 0;j < 13;j++)
              {
                  k = (j+1);
                  var cellname = rowIndex[i] + k;
                  var cell = $(this).find(cellname).text();

                  if(cell == "b")
                  {
                      $('body').append("<td width=25> </td> ");
                  }
                  else if(cell == "c")
                  {
                      $('body').append("<td width=25 bgcolor=black> </td> ");
                  }
                  else
                  {
                     $('body').append("<td width=25>" + cell + "</td> ");
                  }


              }


              $('body').append("</tr> ");
          }

          $('body').append("</table>");
      }

  });
  alert(A);

   });

 })                                     
 </script>                                                               
 </head>                                                                 
 <body>                                                             



 </body>                                                                 
 </html>

В Firefox он отображается в виде таблицы с одним столбцом. В IE7 таблица не отображается вообще. В чем будет проблема. Версия jQuery 1.4

Ответы [ 3 ]

2 голосов
/ 07 сентября 2010

Вы не должны делать такие вещи: $('body').append("</tr> ");

При использовании JavaScript для создания DOM-узлов вы должны создавать весь узел, а не открывать и закрывать его.Например, чтобы построить таблицу, вы должны сделать что-то вроде этого: 

var table = $('<table>',{border: '1'}).appendTo('body');
for (var i = 0; i < 5; i++) {
    var tr = $('<tr>').appendTo(table);
    for (var j = 0; j < 5; j++) {
        var td = $('<td>').text(i + ',' + j).appendTo(tr);
    }
}
2 голосов
/ 07 сентября 2010

Вам необходимо заключить значения ширины и высоты в кавычки.Кроме того, вместо добавления к телу каждой отдельной строки, создайте строковую переменную, к которой вы добавляете html.Затем, в конце, добавьте всю строку.

1 голос
/ 07 сентября 2010

Каждый раз, когда вы используете $('body').append(), вы добавляете к document.body, поэтому работайте так: 

var $table=$('<table border="1">');

$(document.body).append($table);
...
$table.append('<tr></tr>');
..

и т.

...