0

サンプルコードがあります：

<input type="checkbox" id="input_modem_1" onclick="add_delete_row(this, 1,'test1' )" name="modem_id[]" value="1" /> test 1
<input type="checkbox" id="input_modem_2" onclick="add_delete_row(this, 2,'test2' )" name="modem_id[]" value="2" /> test 2
<table id="modem_list"></table>

そして、JavaScriptをコーディングします。

<script>
function add_delete_row(element, id, modem_name) {
    if(element.checked) {
        if(id) {
            deleteRow(id);
        }
        addRow(id, modem_name);
    } else {
        deleteRow(id);
    }
}
function addRow(id, modem_name) {
    var table = document.getElementById("modem_list");

    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    var cell1 = row.insertCell(0);
    var element1 = document.createElement("input");
    element1.type = "checkbox";
    cell1.appendChild(element1);

    var cell2 = row.insertCell(1);
    var element2 = document.createElement("input");
    element2.type = "hidden";
    element2.value = id;
    cell2.innerHTML = modem_name;
    cell2.appendChild(element2);
}
function deleteRow(id) {
    try {
        $('modem_list').removeChild($('modem_'+id));
        $('modem_list').removeChild($('input_modem_'+id));
    } catch(err){}
}
</script>

値をチェックすると結果が行を追加し、この行のチェックを外すと結果が実行されず、さらにこれが追加されます。修正方法

4

3 に答える 3

0

row.setAttribute("name","modem_"+id);後に追加var row = table.insertRow(rowCount);

function deleteRow(id)そして次のものと交換してください

function deleteRow(id) {
    var table = document.getElementById("modem_list");
    var rowName = 'modem_'+id;
    if (table.rows.namedItem(rowName)) {
        table.deleteRow((table.rows.namedItem(rowName).rowIndex));
    }
}

jqueryなしで動作します

于 2012-06-13T09:57:57.973 に答える
0

このコードを使用することはできません：function addRow()追加：

var row = table.insertRow(rowCount);
row.className = "input_"+id; // with id is 1, 2, ...n

と：

function deleteRow(id) {
    try {
        jQuery(".input_"+id).remove();
    } catch(err){}
}
于 2012-06-13T09:34:55.110 に答える
0

jQueryを使用してIDで要素を選択する場合は、ハッシュ記号を使用する必要があります。あれは

$('#modem_list')

いいえ

$('modem_list')
于 2012-06-13T09:38:17.520 に答える