检测html(表单)表中的行数据更改(JavaScript / Jquery)

Detect row data change in html (form) table (JavaScript / Jquery)

本文关键字:JavaScript Jquery 数据 表单 html 检测      更新时间:2023-09-26

你好,我是一名读者,在这里得到了很多帮助。这是我的第一篇文章。我知道这可能是一个类似的问题,但我仍然找不到答案。有人能帮我写一个JavaScript/jquery代码:如果用户修改这些字段中的任何一个,那么dbFlag值将设置为"U"(初始化)。"N")。我正在努力产生正确的代码。注意:数据行是从DB填充的,所以可以是1行,也可以是N行。非常感谢你的时间和努力。

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <form name="form1" id="form1" action="saveData" method="POST">
            <table id="dataTable" border="1">
                <tbody>
                    <tr>
                        <th>Badge #</th>
                        <th>turn #</th>
                        <th>Comment</th>
                    </tr>   
                    <tr>
                        <td><input type="text" size="7" name="badge" id="badge" value="000000" /></td>
                        <td>
                            <select name="descMpoint" id="descMpoint2">
                                <option value="1">1</option>
                                <option value="2">2</option>
                                <option value="3">3</option>
                            </select>                    
                        </td>
                        <td><textarea name="comment" cols="50" rows="2">txt area</textarea></td>             
                        <td><input type="hidden" name="dbFlag" id="dbFlag" value="N" />     
                    </tr>
                </tbody>
            </table>
            <br>
            <span class="tab"><input type="submit" name="updateData" value="Submit" id="updateData"/></span>
            <br><hr>
        </form>
    </body>
</html>
使用change事件:
$('#form1').on('change', 'input, select, textarea', function(){
    $(this).closest('tr').find('input[name="dbFlag"]').val('U');
});

jsFiddle,.change ()

在jQuery中,使用change event函数。请注意,当相关字段未聚焦/模糊时,该函数会触发。

的例子:

$("#badge").change(function(){
    var currentElement = $(this); //reference to the element that was changed
    //etc. etc.
});

JSFiddle: http://jsfiddle.net/kfdNs/