Question

对于下面的代码，我需要您的专业知识。

 <html>
    <head>
    <script>
    function delrow() {

       document.getElementById("db_grid_row1").style.display = 'none';
       document.getElementById("db_grid_row2").style.display = 'none';
       document.getElementById("db_grid_row3").style.display = 'none';
       document.getElementById("db_grid_row4").style.display = 'none';

    }
    </script>
    </head>
    <body>
    <form action="rowhide_action.php" method="post" name="save_form">

    <input type="button" value="Delete" onClick="delrow();"></input>


    <table border="1">
    <thead>
    <tr>
    <th>#</th>
    <th>Databases</th>
    </tr>
    </thead>

    <tbody id="db_grid">

    <tr id="db_grid_row1">
    <td><input type="checkbox" name="cbox[]" value="1" ></input></td>
    <td><input type="text" name="db[]" value="Oracle"></input></td>
    <td><input type="hidden" name="modeflag[]" value="S" ></input></td>
    </tr>

    <tr id="db_grid_row2">
    <td><input type="checkbox" name="cbox[]" value="1"></input></td>
    <td><input type="text" name="db[]" value="MySQL"></input></td>
    <td><input type="hidden" name="modeflag[]" value="S"></input></td>
    </tr>

    <tr id="db_grid_row3">
    <td><input type="checkbox" name="cbox[]" value="1"></td>
    <td><input type="text" name="db[]" value="Cassandra"></input></td>
    <td><input type="hidden" name="modeflag[]" value="S"></input></td>
    </tr>

    <tr id="db_grid_row4">
    <td><input type="checkbox" name="cbox[]" value="1"></input></td>
    <td><input type="text" name="db[]" value="Mongo"> </input></td>
    <td><input type="hidden" name="modeflag[]" value="S"></input></td>
    </tr>

    </tbody>
    </table>
    </br>
    <input type="submit" value="Save"></input></br></br>
    </form>
    </body>
    </html>

选中复选框并单击删除按钮时，我想要（1）必须隐藏复选框行。（2）改变元素modeflag []值=＆＃34; D＆＃34;对于隐藏的行

请帮忙。提前谢谢。

Answer 1

使用jquery它是这样的：

$(function() {
     $("#del").on('click', delrow);
});
function delrow() {
    var checks = $( "input[type=checkbox]:checked" );
    checks.parent().parent().hide();
}

DEMO

注意我将你的html元素中的事件移除到javascript .. 如果您有任何问题，请告诉我

JavaScript：选中复选框并单击按钮时隐藏所有网格行

1 个答案: