-1

最後にこのテーブルに行を追加および削除したいのですが、どうすればこれを達成できますか

<table align="left" id="postq" style="display: none;" border="2" style="width: 519px">
    <tr>
    <th align="left"><label id="Label1"> Kind of Work </label></th>
    <th align="left"><label id="Label1"> Name Of The Client </label></th>
    <th align="left"><label id="Label1">Name of Firm / Organisation </label></th>
    </tr>
    <tr>
    <td> 
    <input title="Enter Kind Of work 1" readonly="readonly" onclick="if(this.value!=''){this.value='';opendrop1();}else{opendrop1();}" id="other_work1" name="other_work1" type="text" size="30" <?php if (isset($errors)) { echo 'value="'.htmlentities($_POST['other_work1']).'"'; } ?>  >                
    </td>                       
     <td><input name="client_name1" type="text" id="client_name1" size="40" /></td>
     <td><input name="firm_name1" type="text" id="firm_name1" size="40"/></td>
    </tr>
    </table>

私はこのスクリプトを追加しました

 <!--add kind of work rows-->
    <script type="text/javascript">
      $(document).ready(function () {
     var counter = 2;
    $("#addButton").click(function () {

                if (counter > 10) {
                    alert("Only 10 textboxes allow");
                    return false;
                }            
                var $row = $('<tr>');//$('<tr id="row'+counter+'"></tr>')
            $row.html('<td><input title="Enter Kind Of work " readonly="readonly" onclick="if(this.value!=''){this.value='';opendrop();}else{opendrop();}" id="other_work' + counter + '" name="other_work' + counter + '" type="text" size="30" onclick="opendrop()"  <?php if (isset($errors)) { echo 'value="'.htmlentities(@$_POST['other_work' + counter + '']).'"'; } ?>> </td>
     <td><input name="client_name' + counter + '" type="text" id="client_name' + counter + '" size="40"/></td>
     <td><input name="firm_name' + counter + '" type="text" id="firm_name' + counter + '" size="40"/></td>');
     $('#postq').append($row);
                counter++;
            });
    </script>

このボタンですが、まだ機能していません

<input type='button' value='Add Button' id='addButton' />
4

3 に答える 3

1

行を追加するには:

$('#postq>tbody')
    .append($('<tr>')
        .append($('<td>')
            .text('cell 1 text'))
        .append($('<td>')
            .text('cell 2 text')));

行を削除するには:

$('#postq>tbody>tr').remove();
于 2013-01-03T10:47:09.993 に答える
0

$('#postq tr:last').remove()最後の行を削除します。

$('<tr class="yournewrow" />').insertAfter('#postq tr:last');テーブルの最後に新しい行を挿入できます。

于 2013-01-03T10:48:01.043 に答える
0

最後に行を追加するには:

$('#postq > tbody:last').append('<tr><td>Added here</td></tr>');

最後に行を削除するには:

$('#postq > tbody:last tr:last').remove();
于 2013-01-03T11:33:55.143 に答える