jQuery动态追加tr元素以及样式渲染

话不多说,直接上代码,^_^

<div data-options="region:'west',split:true" style="width:100%;">
    <table class="form_table" width="60%" style="margin-top: 15px; margin-left: 15px;">
        <tr>
            <td align="left" width="8%;" style="height:32px;" class="form_label">金额:td>
            <td width="10%" style="height:32px;" class="form_data" colspan="2" align="left">
                <input name="je" class = "easyui-textbox" style="width:225px; height: 28px;"/>  
                <a href="#" class="easyui-linkbutton c1"  iconCls="icon-add" onclick="addTr('form_table',-1);">a> 
            td>
        tr>
    table>
div>

<script type="text/javascript">
    //动态添加tr
    function addTr(tab,row) {
       var trHtml="" +
            "金额:" +
            "" +
                " " +
                ""+
            "" +
        "";
        var $tr = $ ("."+tab+" tr").eq(row);
        if($tr.size() == 0){
           layer.confirm("指定的table id或行数不存在!!!");
           return;
        }

        $tr.after(trHtml);
        //渲染样式
        $.parser.parse('.form_table');
    }

    function delTr(obj) {
        layer.confirm("确认要删除当前行吗???", { time: 0 // 不自动关闭
            ,btn: ['确定','取消']
            ,yes: function(index){
                $(obj).parents("tr").remove();
                layer.close(index);
            }
        });
    }
script>

jQuery动态追加tr元素以及样式渲染_第1张图片

你可能感兴趣的:(jQuery)