2

ユーザーが任意の数のフィールドを追加して、提供された情報をデータベースに挿入できるようにするフォームがあります。使用されていない行がある場合は、[テキストの削除]をクリックしてそれらを削除し、データベースに空の行がたくさんないようにすることができます。

jQueryを使用して行を追加し、データベースにデータを挿入しましたが、不要な行を削除するのに苦労しています。jQueryがremove（）関数を実行すると、trにnoneが表示されるだけなので、ユーザーは行を見ることができませんが、行はまだ存在し、データベースに空白行を挿入します。テーブルの行全体を完全に削除して、空白のデータを入力できないようにする方法はありますか？

これが私のコードです：

HTML：

<table width="960px" border="0" id="entries">
<tr>
  <td><b></b></td>
  <td><b>Department</b></td>
  <td><b>Class</b></td>
  <td><b>Lot #</b></td>
  <td><b>Short Description</b></td>
</tr>

<tr>
  <td><b>1</b></td>
  <td class="firstEntry"><input type="text" name="fields[]"></td>
  <td><input type="text" name="class[]"></td>
  <td><input type="text" name="lot[]" size="5"></td>
  <td><input type="text" name="description[]" size="86"></td>
  <td></td>
</tr>


<div id="container">
<p id="add_field"><a href="#"><span>Add Entries.....</span></a></p>

jQuery：

<script type="text/javascript">
var count = 0;
$(function(){
    var count = 1;
    $('p#add_field').click(function(){

        count +=1;

    $('table#entries').append(
        '<tr><td><strong>' + count + '</strong></td>' + 
        '<td><input id="department_' + count + '" name="fields[]' + '" type="text" /></td>' +
        '<td><input id="class_' + count + '" name="class[]' + '" type="text" /></td>' +
        '<td><input id="lot_' + count + '" name="lot[]' + '" type="text" size="5"/></td>' +
        '<td><input id="description_' + count + '" name="description[]' + '" type="text" size="86"/></td>' +
        '<td><span class="delete">Remove</span></td></tr>' );

     $(".delete").click(function () {
      $(this).closest('tr').remove("slow");
    });

    });



});

4

2 に答える 2

2

「遅い」なしで動作します：

    $(".delete").click(function () {
        $(this).closest('tr').remove();
    });

http://jsfiddle.net/kn3eB/

.remove()の引数はセレクターです。持続時間のかかる.hide()を考えているかもしれません。

于 2013-03-20T17:14:32.883 に答える
2

.remove()パラメータとしてアニメーション効果を使用せず、セレクターのみを使用します。.fadeOut()おそらく、不透明度と表示プロパティを変更するものと混同していますか?

このjsFiddleの例を試してください

$(this).closest('tr').fadeOut(function () {
    $(this).remove()
});
于 2013-03-20T17:15:46.597 に答える