zoukankan      html  css  js  c++  java
  • Jquery 操作table行增减

              开门见山,我就用例子给大家解释吧?

         页面中的元素:

       <table cellspacing="0" id="tQuestion" border="1" rules="all" class="mainTab" style=" 100%">
            <tr>
               <th>
                   大题名称
            </th>
                <th>
                    大题说明
             </th>
                 <th>
                    操作
             </th>
            </tr>
        </table>
    

      js操作元素:

    //新增试卷_添加行
    function addtr(id) {
        tr_id = $("#tQuestion>tbody>tr:last").attr("id");
        tr_id++;
        $('#' + id).append(GetStr(tr_id));
    }
    //新增试卷_删除行
    function deltr(id) {
        tr_id = $("#tQuestion>tbody>tr:last").attr("id");
        if (tr_id != 1) {
            $('#' + tr_id).remove();
        }
    }
    //动态添加一行
    function GetStr(tr_id) {
        var str = "<tr id='" + tr_id + "'><td><input type=\"text\" id=\"TxtTitle_" + tr_id + "\" name=" + tr_id + " value=\"\"  style=\"90%\"/></td>";
        str += "<td><textarea style=\"90%; border: 1px solid rgb(164, 194, 204);\" id=\"TxtPrompt_" + tr_id + "\" cols=\"20\" rows=\"2\" name=" + tr_id + "></textarea></td>";
        str += "<td><input type=\"button\" class=\"normalBtn\" id=\"btnQuestionAdd\" value=\"新增\" name=\"btnQuestionAdd\" onclick=\"addtr('tQuestion')\">";
        str += " <input type=\"button\" class=\"normalBtn\" id=\"btnQuestionDel\" value=\"删除\" name=\"btnQuestionDel\" onclick=\"deltr('tQuestion')\"></td>";
        str += "</tr>";
        return str;
    }
    $(function () {
        $('#tQuestion').append(GetStr(1));
    })
    

      欧了,希望对大家有所帮助,偶尔想不起来我也可以参考一下!呵呵!!!

  • 相关阅读:
    494 Target Sum 目标和
    493 Reverse Pairs 翻转对
    492 Construct the Rectangle 构建矩形
    491 Increasing Subsequences 递增子序列
    488 Zuma Game 祖玛游戏
    486 Predict the Winner 预测赢家
    485 Max Consecutive Ones 最大连续1的个数
    483 Smallest Good Base
    Django Form组件
    Django Auth组件
  • 原文地址:https://www.cnblogs.com/BeyondWJsel/p/2599631.html
Copyright © 2011-2022 走看看