如果表单中 数据已更改,则向用户发出警报 jQuery脏

  • 源码大小:59.7KB
  • 所需积分:1积分
  • 源码编号:19JP-3459
  • 浏览次数:445次
  • 最后更新:2023年06月15日
  • 所属栏目:表单
我要下载
加入收藏
本站默认解压密码:19jp.com 或 19jp_com

简介

jQuery Dirty插件检测HTML表单是否为“Dirty”,并提示用户在离开之前保存更改。

如何使用它:

1.要使用此插件,请包含jquery.dirty.js查询在jQuery库之后。

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/dist/jquery.dirty.js"></script>

2.调用HTML表单上的函数,并在表单变为“脏”时触发一个函数。

<form action="#" id="form">
  Form Fields Here
</form>
$("#form").dirty({
  onDirty: function(){
    alert("Dirty");
  }
});

3.当页面上有未保存的更改时,防止用户导航离开

$("#form").dirty({
  preventLeaving: true
});

4.如果表单为“脏”,则在用户试图导航离开时自定义警告消息。

$("#form").dirty({
  leavingMessage: "There are unsaved changes on this page which will be discarded if you continue."
});

5.当表单获得“Clean”时触发函数。

$("#form").dirty({
  onClean: function(){
    alert("Clean");
  }
});

6.API方法。

// detects if a form has been modified
// returns true or false
$("#form").dirty("isDirty");

// detects if a form is Clean
// returns true or false
$("#form").dirty("isClean");

// refreshes events
$("#form").dirty("refreshEvents");

// resets the form
$("#form").dirty("resetForm");

// sets the state to Clean
$("#form").dirty("setAsClean"); 

// shows modified form fields
$("#form").dirty("showDirtyFields");

更新日志:

2022-07-23

  • JS更新

2022-07-22

  • 为回调函数添加保护子句

v0.8.3 (2021-02-15)

  • 更新版本,包括一些依赖项更新和基础设施更改,以通过GitHub操作构建npm包

2020-09-20

  • 删除stopImmediatePropagation以防止核攻击其他订阅者

2020-04-13

  • 如果恢复了初始值,则将表单标记为干净

预览截图