Question

如何动态删除行？

抱歉，我没有嵌入uses Winapi.Windows, Winapi.Messages, System.SysUtils, System.Variants, System.Classes, Vcl.Graphics, Vcl.Controls, Vcl.Forms, Vcl.Dialogs, Vcl.ComCtrls, Vcl.StdCtrls, System.Generics.Collections; type tSymbol = record CloseList: TList<Integer>; OpenList: TList<Integer>; VolumeList: TList<Integer>; end; TForm1 = class(TForm) Button1: TButton; ProgressBar1: TProgressBar; Memo1: TMemo; Button2: TButton; procedure Button1Click(Sender: TObject); procedure FormCreate(Sender: TObject); procedure FormDestroy(Sender: TObject); procedure Button2Click(Sender: TObject); private ReadList, WriteList: TList<tSymbol>; end; procedure TForm1.Button1Click(Sender: TObject); // it takes 45 seconds. var _FileStream: TFileStream; i, j: Integer; begin Memo1.Lines.Add(FormatDateTime('hh:mm:ss', Time)); ProgressBar1.Min := 0; ProgressBar1.Max := 999; _FileStream := TFileStream.Create('test', fmCreate); for i := 0 to 999 do begin for j := 0 to 999 do begin _FileStream.Write(WriteList.List[i].CloseList.List[j], 4); _FileStream.Write(WriteList.List[i].OpenList.List[j], 4); _FileStream.Write(WriteList.List[i].VolumeList.List[j], 4); end; ProgressBar1.Position := i; end; _FileStream.Free; Memo1.Lines.Add(FormatDateTime('hh:mm:ss', Time)); end; procedure TForm1.Button2Click(Sender: TObject); // it takes 6 seconds. var _FileStream: TFileStream; _Close, _Open, _Volume: Integer; _Symbol: tSymbol; i, j: Integer; begin Memo1.Lines.Add(FormatDateTime('hh:mm:ss', Time)); ProgressBar1.Min := 0; ProgressBar1.Max := 999; _FileStream := TFileStream.Create('test', fmOpenRead); for i := 0 to 999 do begin _Symbol.CloseList := TList<Integer>.Create; _Symbol.OpenList := TList<Integer>.Create; _Symbol.VolumeList := TList<Integer>.Create; for j := 0 to 999 do begin _FileStream.Read(_Close, 4); _Symbol.CloseList.Add(_Close); _FileStream.Read(_Open, 4); _Symbol.OpenList.Add(_Open); _FileStream.Read(_Volume, 4); _Symbol.VolumeList.Add(_Volume); end; ReadList.Add(_Symbol); ProgressBar1.Position := i; end; _FileStream.Free; Memo1.Lines.Add(FormatDateTime('hh:mm:ss', Time)); end; procedure TForm1.FormCreate(Sender: TObject); var _Symbol: tSymbol; i, j: Integer; begin ReadList := TList<tSymbol>.Create; WriteList := TList<tSymbol>.Create; _Symbol.CloseList := TList<Integer>.Create; _Symbol.OpenList := TList<Integer>.Create; _Symbol.VolumeList := TList<Integer>.Create; for i := 0 to 999 do begin for j := 0 to 999 do begin _Symbol.CloseList.Add(0); _Symbol.OpenList.Add(0); _Symbol.VolumeList.Add(0); end; WriteList.Add(_Symbol); end; end; procedure TForm1.FormDestroy(Sender: TObject); begin ReadList.Free; WriteList.Free; end;发布

my fiddle code here

Answer 1

点击

使用jquery

$(document).on('click', '.btn', function() { $(this).parent().parent('tr').remove(); });

$('.add').on('click', function() {
    $('tbody').append('<tr>' +
        '<td class="col-xs-1"><input type="text" class="no"></td>' +
        '<td class="col-xs-4"><input type="text" class="item"></td>' +
        '<td class="col-xs-5"><input type="text" class="description"></td>' +
        '<td class="col-xs-2">' +
        '<button class="btn">' +
        '<i class="fa fa-trash-o"></i>' +
        'Delete' +
        '</button>' +
        '</td>' +
        '</tr>');
});
$(document).on('click', '.btn', function() {
    $(this).parent().parent('tr').remove();
});

input {
    width: 100%;
}

.add {
    float: right;
    margin-right: 10px;
    margin-top: 50px
}

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<button class="btn add">
    <i class="fa fa-plus"></i> add
</button>
<table class="table">

    <thead>
        <tr>
            <th class="col-xs-1">No</th>
            <th class="col-xs-4">Item</th>
            <th class="col-xs-5">description</th>
            <th class="col-xs-2">Action</th>

        </tr>
    </thead>

    <tbody>
        <tr>
            <td class="col-xs-1">1</td>
            <td class="col-xs-4">Lipsum</td>
            <td class="col-xs-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea earum hic accusamus, reprehenderit recusandae, quisquam consequatur quasi eum cum, nam atque aperiam at? Veniam cupiditate, commodi numquam voluptates dicta nisi.</td>
            <td class="col-xs-2">
                <button class="btn">
                    <i class="fa fa-trash-o"></i> Delete
                </button>
            </td>
        </tr>
    </tbody>
</table>

如何使用jquery动态删除表行

1 个答案: