4

ユーザーが他の複数の人を登録できる登録ページを作成しています。ユーザーが特定のオプションを選択した場合にのみテーブルが表示されるようにしました。追加ボタンも追加しました。これにより、行が完全に追加されます。問題は、削除ボタンの機能を追加するとすべてが壊れることです。これが私のhtmlです：

<div id="add_table" style="display:none;" >
    <button type="button" id="AddLine">Add Line</button>
    <table border="1px" id="table">
        <tr>
            <td>First Name</td>
            <td>Last Name</td>
            <td>Phone</td>
            <td>Email</td>
            <td>Ethnicity</td>
        </tr>
        <tr>
            <td><input type=text /></td>
            <td><input type=text /></td>
            <td><input type=text /></td>
            <td><input type=text /></td>
            <td><input type=text /></td>
            <td><button type="button">delete</button></td>
        </tr>
    </table>​
</div>

そして、ここに私のjqueryコードがあります:

$(document).ready(function(e) { 
    $("input[name= 'Reg_num_r']").change( function () {
        if($(this).val()==1) {
            $("#add_table").hide();
        } else {
            $("#add_table").show();
        }
    });

    /*$("#table").on("click", "button", function() {
       $(this).closest("tr").remove(); 
    });​*/

    $("#AddLine").click(function () {
        var row = "<tr><td><input type=text /></td><td><input type=text /></td><td><input type=text /></td><td>                   <input type=text /></td><td><input type=text /></td><td><button type=button>delete</button></td></tr>";
        $("#table").append(row);
    });
});

上記のコメント付きコードのコメントを外すと、すべてが機能しなくなります。ユーザーが正しいオプションを選択しても、表は表示されません。行の削除操作を適切に実行するには、どうすれば修正できますか?

4

1 に答える 1

2

Ctrl+CCtrl+Vあなたのコードから：

/*$("#table").on("click", "button", function() {
    $(this).closest("tr").remove(); 
});​*/

最後のセミコロンの後に幅 0 のスペースがあります。[編集] をクリックし、矢印キーを使用して表示します。これは JavaScript では無効な文字であり、構文エラーが発生します。

これは、jsFiddle やその他の場所からコードをコピーするときによくある問題です。

copypasta コードを確認するためにNotepad++のコピーを手元に用意することをお勧めします。デフォルトでは、これらの非表示の文字が表示さ?れます。

ここに画像の説明を入力

コードのコメントを外してJSHintでテストすることもできます。無効な文字がどの行にあるかがわかります。

于 2012-09-16T23:44:38.820 に答える