Javascript模板引擎mustache.js使用

1.首页定义模板

<script type="text/template" id="customerPrMtTpl">
                        <tr>
                            <td>
                                <input name="rukuxiangqinglist[{{idx}}].wuliaoname" type="text" value="{{row.wuliaoname}}" maxlength="32" class="input-small " readonly="readonly"/>
                            </td>
                            <td>
                                <input name="rukuxiangqinglist[{{idx}}].danwei" type="text" value="{{row.danwei}}" maxlength="32" class="input-small " readonly="readonly"/>
                            </td>
                            <td>
                                <input name="rukuxiangqinglist[{{idx}}].guige" type="text"  value="{{row.guige}}" maxlength="32" class="input-small " readonly="readonly"/>
                            </td>
                            <td>
                                <input name="rukuxiangqinglist[{{idx}}].zongshuliang" type="text"  value="{{row.zongshuliang}}" maxlength="32" class="input-small " readonly="readonly"/>
                            </td>
                            <td>
                                <input name="rukuxiangqinglist[{{idx}}].oldshuliang" type="text"  value="{{row.oldshuliang}}" maxlength="32" class="input-small " readonly="readonly"/>
                            </td>
                            <td>
                                <input name="rukuxiangqinglist[{{idx}}].shuliang" id="rukuxiangqinglist{{idx}}_shuliang" type="text"  value="{{row.shuliang}}" maxlength="32" class="input-small "/>
                            </td>
                        </tr>
                    </script>

2.再整理模板

<script type="text/javascript">
                        var customerPrMtTpl =  $("#customerPrMtTpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g,"");
</script>

3.渲染页面

 $("#myTabel").append(Mustache.render(customerPrMtTpl, {
                                     idx:idx,delBtn: true, row: comment
                                 }));