當前位置:
首頁 > 知識 > JQ判斷from表單是否修改兩種方式

JQ判斷from表單是否修改兩種方式

第一種為HTML表單元素添加onchange事件處理器是一種可行的方法,這也是用的最多的,但是onchange的實現有一些問題存在:

1.如果用戶改變表單域的值,然後再修改回原始值,程序仍將認為表單的修改已經發生。

2.如果表單項的值是通過Javascript動態修改的,onchange事件不會被自動觸發。

3.為每一個表單元素增加onchange事件會引起性能問題,特別是較大的表單。

4.如果將表單元素從DOM中增加或移除,你需要相應的註冊或移除事件偵聽。

5.checkbox和radio的onchange事件在某些瀏覽器下不能按預期工作(你應該知道是哪個瀏覽器)。

6.除了onchange,還有更簡單有效的方案。

<script type="text/javascript" src="jquery.js"></script>

<script>

$(function() {

$("#myform :input").change(function(){

$("#myform").data("changed",true);

});

});

function mysubmit(){

alert($("#myform").data("changed"));

if($("#myform").data("changed")){

alert("輸入框修改過!")

}else{

alert("沒有修改過,繼續!");

}

}

</script>

</HEAD>

<BODY>

<form id="myform">

<input type="text" name="aa"/>

<input type="text" name="bb"/>

<select><option>aaa</option><option>bbb</option></select>

<input type="button" value="提交" onclick="mysubmit()"/>

</form>

第二種就是直接比較form表單載入前和提交時的數據

1.在表單載入(初始化)就把表單序列化成json格式數據

2.點擊提交按鈕在把表單序列化成json格式數據然後進行比較

$(function(){

var dataformInit = $("#form1").serializeArray();

var jsonTextInit = JSON.stringify({ dataform: dataformInit });

$("#bt_submit").click(function(){

var dataform = $("#form1").serializeArray();

var jsonText = JSON.stringify({ dataform: dataform });

if(jsonTextInit==jsonText) {

alert("表單值沒有改變!");

return false;

}else{

alert("表單值改變了!");

return false;

}

})

})

JQ判斷from表單是否修改兩種方式

喜歡這篇文章嗎?立刻分享出去讓更多人知道吧!

本站內容充實豐富,博大精深,小編精選每日熱門資訊,隨時更新,點擊「搶先收到最新資訊」瀏覽吧!


請您繼續閱讀更多來自 程序員小新人學習 的精彩文章:

關於C插件編程和插件宿主數據傳遞的一些方法
C井調用Windows API實現自動登錄

TAG:程序員小新人學習 |