Heim  >  Artikel  >  Backend-Entwicklung  >  dwz使用jQuery追加表格,原有的行有相应的css样式,但是用jQuery追加的行没有样式

dwz使用jQuery追加表格,原有的行有相应的css样式,但是用jQuery追加的行没有样式

WBOY
WBOYOriginal
2016-06-06 20:07:321266Durchsuche

如题
dwz如何才能解决使用jQuery追加的表格行有原生table行的样式?

<code><table class="list" width="100%" layouth="60">
        <thead>
            <tr>
                <th width="10%">ID</th>
                <th width="40%">报告编号</th>
                <th width="40%">试验编号</th>

            </tr>
        </thead>
        <tbody id="wtlb">
            <tr target="wtlb_list" rel="1">
                <td>1</td>
                <td>W201600001</td>
                <td>T201600001</td>
            </tr>
            <tr target="wtlb_list" rel="2">
                <td>1</td>
                <td>W201600002</td>
                <td>T201600002</td>
            </tr>
               
        </tbody>
    </table>
    <button id="add"> 添加行</button>
    <script type="text/javascript">
       $(document).ready(function(){
               $("#add").click(function(){
                $str='';
                $str+="<tr>";
                $str+="<td>000";
                $str+="<td>002";
                $str+="<td>003";   
                $str+="";
                $("#wtlb").append($str);
        });
       });
    </script></code>

回复内容:

如题
dwz如何才能解决使用jQuery追加的表格行有原生table行的样式?

<code><table class="list" width="100%" layouth="60">
        <thead>
            <tr>
                <th width="10%">ID</th>
                <th width="40%">报告编号</th>
                <th width="40%">试验编号</th>

            </tr>
        </thead>
        <tbody id="wtlb">
            <tr target="wtlb_list" rel="1">
                <td>1</td>
                <td>W201600001</td>
                <td>T201600001</td>
            </tr>
            <tr target="wtlb_list" rel="2">
                <td>1</td>
                <td>W201600002</td>
                <td>T201600002</td>
            </tr>
               
        </tbody>
    </table>
    <button id="add"> 添加行</button>
    <script type="text/javascript">
       $(document).ready(function(){
               $("#add").click(function(){
                $str='';
                $str+="<tr>";
                $str+="<td>000";
                $str+="<td>002";
                $str+="<td>003";   
                $str+="";
                $("#wtlb").append($str);
        });
       });
    </script></code>

虽然有一部分不太明白,不过你加的code和之前已有的不太一样啊:

<code class="javascript">$(document).ready(function(){
    $("#add").click(function(){
        $str='';
        $str+="<tr target='\"wtlb_list\"' rel='\"3\"'>";
        $str+="<td>000</td>";
        $str+="<td>002</td>";
        $str+="<td>003</td>";   
        $str+="</tr>";
        $("#wtlb").append($str);
    });
});</code>

rel的部分,看起来还有自增的需求,自增你搞得定

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn