我可以使用Jquery来插入关闭的< / tr>标签和开口< tr>标签内部动态表？ [英] Can I use Jquery to insert a closing </tr> tag and an opening <tr> tag inside a dynamic table?

问题描述

我正在尝试使用下面的代码动态添加关闭标签，然后打开，以便我每三个单元格创建一个新行。几乎工作，DOM检查员显示一个TR节点，问题是，有些事情tr没有关闭tr标签。我是Jquery的新手，这个代码有什么问题吗？

 < script src =http ：//ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.1.min.jstype =text / javascript>< / script> 
< script type =text / javascript> 
 $（document）.ready（function（）{
 $（'td：nth-​​child（3n）'）。after（'< / tr>< tr>'）; 
}）; 
< / script> 
 
< table id =mytablewidth =266border =1cellspacing =10cellpadding =10> 
< tbody> 
< tr> 
<？php 
函数somelongassfunction（）{
 return'Hello'; 
} 
函数have_products（$ a）{
 return $ a <= 20; 
} 
 $ x = 0; 
 while（have_products（$ x））{
 echo'< td>'。 somelongassfunction（）。 < / TD>; 
 $ x ++; 
 // ------------------------------------- 
 / * if （fmod（$ x，3）== 0）{
 echo'< / tr>< tr>'; 
继续; 
} * / 
 // ------------------------------------- -  
 if（$ x == 20）{
 break; 
} 
} 
？> 
< / tr> 
< / tbody> 
< / table> 
  

解决方案

您无法处理DOM选择，就好像它是一个HTML文档。 DOM文档是节点的层次结构，而不是标记。 HTML中的标签被浏览器解析为DOM文档。您不能再添加一点HTML，然后再将其解析成DOM结构。

相反，您需要执行包装jQuery的。这是一个可行的方法 - 它可能不是最有效的。

  $（'td'）。each（function idx）{
 if（idx％3）{
 return; 
} else {
 $（this）.nextAll（'：lt（2）'）andSelf（） .wrapAll（'< tr />'）; 
} 
}）。parent（）。unwrap（）; 
  

jsFiddle

I'm trying to use the code below to dynamically add closing tag followed by opening so that i creates a new row every three cells. Almost working, DOM inspector shows a TR node, problem is, something happens tr isn't closing the tr tag. I'm new to Jquery, is there anything I'm doing wrong with this code?

         <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.1.min.js" type="text/javascript"></script>
        <script type="text/javascript">
        $(document).ready(function(){
        $('td:nth-child(3n)').after('</tr><tr>');
        });
        </script>

        <table id="mytable" width="266" border="1" cellspacing="10" cellpadding="10">
        <tbody>
          <tr>
        <?php
        function somelongassfunction(){
            return 'Hello';
            }
        function have_products($a){
            return $a<=20;
            }
        $x=0;
        while (have_products($x)) {
            echo '<td>' . somelongassfunction() . '</td>';
            $x++;
        //------------------------------------- 
        /*if (fmod($x,3) == 0) {
                        echo '</tr><tr>';
                        continue;
                        }*/
        //--------------------------------------                    
        if ($x==20){
            break;
            }   
        }   
        ?>
        </tr>
        </tbody>
        </table>    

解决方案

You can't work on a DOM selection as if it was an HTML document. A DOM document is a hierarchy of nodes, not of tags. The tags in your HTML are parsed into a DOM document by the browser. You can't then add a single bit of HTML and then expect it to be parsed back into a DOM structure.

Instead, you'll need to do the wrapping in jQuery. This is a viable approach -- it may not be the most efficient.

$('td').each(function(idx) {
    if (idx % 3) {
        return;
    } else {
        $(this).nextAll(':lt(2)').andSelf().wrapAll('<tr/>');
    }
}).parent().unwrap();

jsFiddle

这篇关于我可以使用Jquery来插入关闭的< / tr>标签和开口< tr>标签内部动态表？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！