• jquery tmpl的使用


    1、引用jquery.tmpl.min.js

    <script type="text/javascript" src="/js/jquery/jquery.tmpl.min.js"></script>

    https://github.com/jquery/jquery-tmpl下载

    2、写模板的内容

    <script id="titleTemplate" type="text/x-jquery-tmpl">
    <tr class='odd' id="tr{{= randomid}}">
    <td  align='center'></td>
            <td>
    <input type='hidden' name='id' value='{{= id}}'/>
                <input type='text' name='shbhc' class="vesearchbox validate[required,maxSize[10]]" id='shbhc{{= randomid}}'  onclick="$.showShBox($(this),{valueField:'shbh{{= randomid}}'})" value='{{= shmc}}'/>
    <input type='hidden' name='shbh' id="shbh{{= randomid}}" value='{{= shbh}}'/>
    <font color="red">*</font>
    </td>
            <td>
    <select name="cpbh" style="100px" class="searchselect validate[required,maxSize[30]]" id="select{{= randomid}}">
    <option value="">=全部=</option>
    <c:forEach items="${cplist}" var="cp">
         <option value="${cp.cpbh}">${cp.cpmc }</option>
    </c:forEach>
    </select>
    <font color="red">*</font>
    </td>
            <td><input name='jzgy' class='inputtext validate[required,maxSize[500]]' id='jzgy' size='20'   value='{{= jzgy}}'/>
    <font color="red">*</font>
    </td>
            <td align='center'>
       <img src='/images/qk-del.gif' title='删除' style='cursor: pointer;' onclick="del('{{= randomid}}');"/>
            </td>
        </tr>
      </script>

    3、点按钮触发


    //修改 添加一行
    function add(){
    var randomid = new Date().getTime();//获取当前时间

           // {"id":"","shbh":"","jzgy":"","cpbh":"","shmc":"","randomid":randomid} 代表转入的参数

          //把模板名为titleTemplate,参数为 {"id":"","shbh":"","jzgy":"","cpbh":"","shmc":"","randomid":randomid} 的模板追加到tb2标签的后面。
    $("#titleTemplate").tmpl( {"id":"","shbh":"","jzgy":"","cpbh":"","shmc":"","randomid":randomid} ).appendTo("#tb2");
    }





  • 相关阅读:
    Linux centos7 安装 phpMyAdmin
    centos7安装显示中文
    js限制按钮每隔一段时间才能再次点击
    PHPMailer 发送邮件
    jquery click事件中的return false
    安装composer
    生成目录树查看目录结构
    VMware桥接模式下虚拟机ping主机不通
    编译U-Boot时command not found的解决方法
    强制删除文件(夹)的方法
  • 原文地址:https://www.cnblogs.com/jiangu66/p/2997469.html
Copyright © 2020-2023  润新知