JavaScript判断用户是否对表单进行了修改的方法

 这篇文章主要介绍了JavaScript判断用户是否对表单进行了修改的方法,实例分析了javascript对表单操作与判定的技巧,需要的朋友可以参考下

 
 

本文实例讲述了JavaScript判断用户是否对表单进行了修改的方法。分享给大家供大家参考。具体分析如下:

这段JS代码可以判断出用户是否对表单内容进行了修改,如果修改了表单,并退出浏览器,则会提醒用户是否要保存表单的内容,是非常有用的代码。

?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

function formIsDirty(form) {
for (var i = 0; i < form.elements.length; i++) {
var element = form.elements[i];
var type = element.type;
if (type == "checkbox" || type == "radio") {
if (element.checked != element.defaultChecked) {
return true;
}
}
else if (type == "hidden" || type == "password" ||
type == "text" || type == "textarea") {
if (element.value != element.defaultValue) {
return true;
}
}
else if (type == "select-one" || type == "select-multiple") {
for (var j = 0; j < element.options.length; j++) {
if (element.options[j].selected !=
element.options[j].defaultSelected) {
return true;
}
}
}
}
return false;
}

使用示例:当退出浏览器是,如果用户修改了表单,则提醒用户是否要保存

?

1
2
3
4
5
6
7
8
9
10
11

window.onbeforeunload = function(e) {
e = e || window.event;
if (formIsDirty(document.forms["someForm"])) {
// For IE and Firefox
if (e) {
e.returnValue = "You have unsaved changes.";
}
// For Safari
return "You have unsaved changes.";
}
};

下面是一个完整的范例代码

复制代码 代码如下:
Click on below button. Now change some values in form and click the button again.
<form name="fooForm">
<input type="text" name="t"><br>
<input type="text" name="2" value="default"><br>
<select name="some">
<option value="fooo" selected="">foo</option>
<option value="bar">bar</option>
</select><br>
</form>
<button onclick="alert(formIsDirty(document.fooForm))">Click to check if Form is Dirty</button>
<br>
<script>
function formIsDirty(form) {
for (var i = 0; i < form.elements.length; i++) {
var element = form.elements[i];
var type = element.type;
if (type == "checkbox" || type == "radio") {
if (element.checked != element.defaultChecked) {
return true;
}
}
else if (type == "hidden" || type == "password" ||
type == "text" || type == "textarea") {
if (element.value != element.defaultValue) {
return true;
}
}
else if (type == "select-one" || type == "select-multiple") {
for (var j = 0; j < element.options.length; j++) {
if (element.options[j].selected !=
element.options[j].defaultSelected) {
return true;
}
}
}
}
return false;
}
</script>

 

希望本文所述对大家的javascript程序设计有所帮助。

时间: 2025-01-11 15:39:20

JavaScript判断用户是否对表单进行了修改的方法的相关文章

JavaScript判断用户是否对表单进行了修改的方法_javascript技巧

本文实例讲述了JavaScript判断用户是否对表单进行了修改的方法.分享给大家供大家参考.具体分析如下: 这段JS代码可以判断出用户是否对表单内容进行了修改,如果修改了表单,并退出浏览器,则会提醒用户是否要保存表单的内容,是非常有用的代码. function formIsDirty(form) { for (var i = 0; i < form.elements.length; i++) { var element = form.elements[i]; var type = element

JavaScript 判断用户输入的邮箱及手机格式是否正确

 JavaScript判断用户输入的邮箱格式是否正确.判断用户输入的手机号格式是否正确,下面有个不错的示例,感兴趣的朋友可以参考下  代码如下: /*  * 功能:判断用户输入的邮箱格式是否正确  * 传参:无  * 返回值:true or false  */  function form_check() {  var email = document.getElementById("email").value; //获取邮箱地址  //判断邮箱格式是否正确  if(!/^w+([-+

html javascript: 用JavaScript判断一个html元素是否存在的几种方法

用javascript判断一个html元素是否存在的五种方法:   1. 判断表单元素是否存在 if("periodPerMonth" in document.theForm){ return true; }else{ return false; } 2. 判断页面元素是否存在 if(document.getElementById("XXX")){ //存在 } 3. 判断表单元素是否存在 if(document.theForm.periodPerMonth){ /

JSP针对表单重复提交的处理方法_JSP编程

本文实例讲述了JSP针对表单重复提交的处理方法.分享给大家供大家参考,具体如下: 1. 在生成表单时执行如下: 复制代码 代码如下: session.setAttribute("forum_add", "forum_add"); 2. 提交处理时作如下判断 if (isRedo(request, "forum_add")) { //提示重复提交,作相关处理 } 相关函数: /** * 判断是否为重复提交 * 1,检查Session中是否含有指定名

JavaScript判断一个字符串是否包含指定子字符串的方法

 这篇文章主要介绍了JavaScript判断一个字符串是否包含指定子字符串的方法,实例分析了javascript字符串操作的技巧,非常具有实用价值,需要的朋友可以参考下     本文实例讲述了JavaScript判断一个字符串是否包含指定子字符串的方法.分享给大家供大家参考.具体分析如下: 下面的JS代码,为String对象定义了一个contains方法用于判断字符串是否包含子字符串,非常有用. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 if (!Array.prototy

JavaScript动态创建form表单并提交的实现方法_javascript技巧

本文实例讲述了JavaScript动态创建form表单并提交的实现方法.分享给大家供大家参考,具体如下: 页面布局有些复杂的情况下,可能需要在页面中动态创建一个 form,JavaScript 创建 form 演示如下: // JavaScript 构建一个 form function MakeForm() { // 创建一个 form var form1 = document.createElement("form"); form1.id = "form1"; f

JavaScript 判断用户输入的邮箱及手机格式是否正确_javascript技巧

复制代码 代码如下: /* * 功能:判断用户输入的邮箱格式是否正确 * 传参:无 * 返回值:true or false */ function form_check() { var email = document.getElementById("email").value; //获取邮箱地址 //判断邮箱格式是否正确 if(!/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(email)) { alert("邮箱格

用JavaScript 判断用户使用的是 IE6 还是 IE7_javascript技巧

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] js判断IE6/IE7/FF 复制代码 代码如下: if (window.XMLHttpRequest) { //Mozilla, Safari,IE7 alert('Mozilla, Safari,IE7 '); if(!window.ActiveXObject){ // Mozilla, Safari, alert('Mozilla, Safari'); } else { alert('IE7'); } } else { alert

javascript 判断用户ie版本信息代码

在要js中判断用户浏览器我们得利用js的activeobject等来判断, if (window.xmlhttprequest) { //mozilla, safari,ie7 alert('mozilla, safari,ie7 '); if(!window.activexobject){ // mozilla, safari, alert('mozilla, safari'); } else { alert('ie7'); } } else { alert('ie6'); } var isi