验证网页上的不同控件

本文关键字:控件 网页 验证 | 更新日期: 2023-09-27 18:12:30

我有一个网页,有40个奇怪的控件,如文本框,单选按钮,复选框,下拉框。我必须实现这样一个场景:如果用户改变了任何控件的状态,并且希望离开页面而不保存它,那么应用程序必须弹出一个弹出窗口。

我明白这需要在客户端完成,但这里的问题是如何检查40多个控制中的哪一个已经更改。

验证网页上的不同控件

您可以在页面加载时保存它们的值,然后在发送表单时将这些值与当前值进行比较。

此示例警告已更改控件的id:

<script type="text/javascript">
    $(document).ready(function () {
        $('.inputToCheck').each(function () {
            $(this).data("oldValue", $(this).val())
        });
        $('#btn').click(function () {
            $('.inputToCheck').each(function () {
                if ($(this).data("oldValue") != $(this).val())
                    alert($(this).attr('id'));
            });
        });
    });
</script>
<input type="text" id="txt1" class="inputToCheck" value="10" />
<input type="text" id="txt2" class="inputToCheck" value="20" />
<input type="text" id="txt3" class="inputToCheck" value="30" />
<input type="button" id="btn" value="send" />