0

アップデート

私はjQuery 1.10.1を使用しています....live減価償却されています...交換したばかりです

$("table.dynatable button.remove").live('click', function (e) { 
$(this).parents("tr").remove();
});

と

$(document).on("click", "table.dynatable button.remove", function() { 
$(this).parents("tr").remove(); 
});

そして今、それはうまくいきます。これが誰かに役立つことを願っています.

私はこのjQueryをphpとhtmlフォームで動作させています:

私のphp：

foreach ($matric_type as $row) {
$matric_type = $row->matric_type;
}

これにより、お持ちのマトリック (12 年生) 認定の種類に応じてドロップダウンが表示されます。各マトリックス認証には、別のドロップダウンに入力されているさまざまな主題のリストがあります。

私のjQuery：

$(document).ready(function () {

    var id = 0;
    event.preventDefault();

    // Add button functionality
    $("table.dynatable button.add").click(function (e) {
        e.preventDefault();
        id++;
        var master = $(this).parents("table.dynatable");

        // Get a new row based on the prototype row
        var prot = master.find(".prototype").clone();
        prot.attr("class", "")
        prot.find(".id").attr("value", id);

        master.find("tbody").append(prot);
    });

    // Remove button functionality
    $("table.dynatable button.remove").live('click', function (e) { // this might be the problem?
        //e.preventDefault();           //this does not work
        // e.stopImmediatePropagation(); //this does not work
        // e.stopPropagation();          //this does not work
        $(this).parents("tr").remove();
        //$(this).closest('.prototype').remove()
        // $(this).parent().parent().remove();         
    });
});

html:

 <table class="dynatable">
                            <thead>
                                <tr>
                                    <th>Subject No</th>
                                    <th>Subject</th>
                                    <th>Mark</th>
                                    <th><button class="add">Add</button></th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr class="prototype">
                                    <td><input type="input" name="id[]" value="0" class="id" readonly /></td>
                                    <td><select id="list"></select></td>
                                    <td><input type="text" name="mark[]" value="" /></td>
                                    <td><button class="remove">Remove</button>
                                </tr>
                        </table>

この jQuery は、追加ボタンを使用して、件名番号を含む行、件名のドロップダウン、その件名のマークを入力するためのテキスト フィールドを追加します。うまく追加できます..問題は削除ボタンに付属しています..削除ボタンをクリックするたびにページが更新され、追加されます

?id%5B%5D=0&mark%5B%5D=&id%5B%5D=1&mark%5B%5D=

URLに。追加する「件名」が増えるほど、上記は長くなります。2つの科目を追加すると

?id%5B%5D=0&mark%5B%5D=&id%5B%5D=1&mark%5B%5D=&id%5B%5D=2&mark%5B%5D=

私は削除機能に追加しようとしました：

e.preventDefault();           
e.stopImmediatePropagation(); 
e.stopPropagation();

ただし、クリックされた行だけでなく、すべての件名の行を削除して、ページを再読み込みします。誰かが私の問題に可能な解決策を提供して助けてもらえますか?

4

1 に答える 1

1

をボタンに追加type=buttonします。それ以外の場合、ボタンはボタンのように機能しsubmitます

<button class="remove" type='button'>Remove</button>
于 2013-07-10T10:47:42.180 に答える