Question

当我尝试使用javascript处理嵌套表时，我陷入困境。我更改后，我的css样式 tr.odd 没有应用于奇数行。当我尝试调试时，我最内层的表结构本身就不存在了。在运行时也没有例外。以前的代码工作得很好。由于一些边缘问题，我通过在现有表中创建表来改变奇数行上的一些代码，现在没有应用CSS样式。

CSS：

tr.odd
{
background-color:#f3f4f5;
\-webkit-font-smoothing: antialiased;
font-weight: normal;
margin: 10px 20px;
padding: 8px;
line-height: 1.42857143;
vertical-align: top;
border-top: 1px solid #ddd;
}

上一个脚本（工作）：

if(line%2==0)
                 $(obj).find('#abc tr:last').after("<tr class='odd'><td><i class='fa fa-building-o'> <b class='companyName' id='oddEmpName'>"+emp+"</b><br/><i class='fa fa-briefcase'> "+eventName+"</br><i class='fa fa-cubes'> "+ind+"</br><i class='fa fa-map-marker'> "+loc +"</td></tr>");
             else
                 $(obj).find('#abc tr:last').after("<tr class='even'><td><i class='fa fa-building-o'> <b class='companyName'id='evenEmpName'>"+emp+"</b><br/><i class='fa fa-briefcase'> "+eventName+"</br><i class='fa fa-cubes'> "+ind+"</br><i class='fa fa-map-marker'> "+loc +"</td></tr>");

当前脚本（不工作）：

if(line%2==0)
                 $(obj).find('#abc tr:last').after("<tr class='odd'>" +
                        "<table>" +
                            "<tbody>" +
                                "<tr>" +
                                    "<td><i class='fa fa-building-o'></td>" +
                                    "<td>"+emp+"</td>" +
                                "</tr>" +
                                "<tr>" +
                                    "<td><i class='fa fa-briefcase'></td>" +
                                    "<td>"+eventName+"</td>" +
                                "</tr>" +
                                "<tr>" +
                                    "<td><i class='fa fa-cubes'></td>" +
                                    "<td>"+ind+"</td>" +
                                "</tr>" +
                                "<tr>" +
                                "   <td><i class='fa fa-map-marker'></td>" +
                                    "<td>"+loc+"</td>" +
                                "</tr>" +
                            "</tbody>" +
                        "</table>" +
                    "</tr>");
             else
                 $(obj).find('#abc tr:last').after("<tr class='even'><td colspan='2'><i class='fa fa-building-o'> <b class='companyName'id='evenEmpName'>"+emp+"</b><br/><i class='fa fa-briefcase'> "+eventName+"</br><i class='fa fa-cubes'> "+ind+"</br><i class='fa fa-map-marker'> "+loc +"</td></tr>");

Answer 1

你在做什么是无效的。

因为表格应放在td内，但您要将其放在tr中。

尝试添加此内容：

$(obj).find('#abc tr:last').after("<tr class='odd'><td>" +
                                   "<table>" + 
                                     // other code as is.
                                   + "</table>" + "</td></tr>");

CSS未应用于嵌套HTML表

1 个答案: