怎样能在提交表单时过滤掉没更改的值，只POST修改过的值？

Question

假如有个网站配置的表单里面有超过二十个的值，有时候只更改了一两个值，如果全部POST的话来更新的话会造成效率很低，能不能在提交时就判断，如果没更改过的值就不提交了？javascript和jquery都略懂一点

Answer 1

但是javascript不是有defaultValue选项吗？因为表单所有的值都是直接从数据库读取然后赋予的，点reset时都能把值还原到默认状态，能不能直接拿这两个值来对比呢？

Answer 2

可以是可以的，但你要注意，初始化时需直接赋值
<input type="text" name="txtName" id="txtName" value="初始化时的值" />
而不能通过下面这种方式去进行初始化
document.getElementById("txtName").value="初始化时的值";defaultValue记住的是表单元素的原始值

Answer 3

function IsFormChanged(el) {  
    var isChanged="";  
    var form = document.getElementById(el);  
    for (var i = 0; i < form.elements.length; i++) {  
        var element = form.elements[i];  
        var type = element.type;  
        if (type == "text" || type == "hidden" || type == "textarea" || type == "button") {  
            if (element.value != element.defaultValue) {  
                isChanged += element.name+"="+element.value+"&";  
            }  
        } else if (type == "radio" || type == "checkbox") {  
            if (element.checked != element.defaultChecked) {  
                isChanged += element.name+"="+element.value+"&";  
            }  
        } 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) {  
                    isChanged += element.name+"="+element.value+"&";  
                }  
            }  
        }       
    }      
    alert(isChanged);  
} 我从网上找到一个类似的，然后自己修改了下，测试的结果是如果所有值都没改过是正常得返回空白，但是如果修改了radio会把1和0都返回(假如有两个单选按钮值为1和0的情况)，而不是只返回修改后的那个，不知道还要怎样修改才行，研究中，楼上高手知道的话提示一下，另外我指的就是所有值都从数据库载入到value的，不是空值。

Answer 4

单选按钮组：它的选中状态有个唯一性，也就是说，假如你对value=0的初始化时已经设置checked="checked" 这时候你再去选中value=1的，那么此时：value=0的选中状态被更改;value=1的也被更改因此就出现你说的那种情况了，这是正常的，符号这段代码的思路

Answer 5

估计你想要的功能应该是这样的
<script  type="text/javascript">
function IsFormChanged(el,radios) {  
    var isChanged="";  
    var form = document.getElementById(el);  
    for (var i = 0; i < form.elements.length; i++) {  
        var element = form.elements[i];  
        var type = element.type; 
        switch(type){
            case "text":
            case "hidden":
            case "textarea":
            case "button":
                isChanged += (element.value != element.defaultValue)?isChanged.length==0?element.name+"="+element.value:"&"+element.name+"="+element.value:"";
                break;
            case "checkbox":
                isChanged += (element.checked != element.defaultChecked)?isChanged.length==0?element.name+"="+element.value:"&"+element.name+"="+element.value:"";
                break;
            case "select-one":
            case "select-multiple": 
                for (var j = 0; j < element.options.length; j++) {
                    isChanged += (element.options[j].selected != element.options[j].defaultSelected)?isChanged.length==0?element.name+"="+element.value:"&"+element.name+"="+element.value:"";  
                }
                break;  
        } 
    }   
    var radiolist=radios.split(',');
    for(var j=0;j<radiolist.length;j++){
        var myRadio=document.getElementsByName(radiolist[j]);
        for(var k=0;k<myRadio.length;k++){
            isChanged += (myRadio[k].checked && !myRadio[k].defaultChecked)?isChanged.length==0?myRadio[k].name+"="+myRadio[k].value:"&"+myRadio[k].name+"="+myRadio[k].value:"";
        }
    }
    alert(isChanged);  
} 
</script>
<form id="chageform">
    <input type="checkbox" name="myBox" value="1"/>
    <input type="checkbox" name="myBox" value="2"/>
    <input type="checkbox" name="myBox" value="3"/><br />
    <input type="radio" name="myRadio" checked="checked" value="1"/>
    <input type="radio" name="myRadio" value="2"/><br />
    <input type="radio" name="myRadio2" value="1"/>
    <input type="radio" name="myRadio2" checked="checked" value="2"/>
<input type="button" value="检测" onclick="IsFormChanged('chageform','myRadio,myRadio2')" />
</form>

Answer 6

我后面整了个功能更齐全点的,在这个贴子里面，自己去复制吧
怎么吧修改过的值 不用&连接，而是像原始的form的name[]数组过滤后还是 name[]数组传过去呢

Answer 7

我后面整了个功能更齐全点的,在这个贴子里面，自己去复制吧
怎么吧修改过的值 不用&连接，而是像原始的form的name[]数组过滤后还是 name[]数组传过去呢
因为我的form是这样的：<form>
<tr>
<td><input type="hidden" name="id[]" value="1"/></td>
<td><input type="text" name="attr[]" /></td>
<td><input type="textarea" name="number[]"/></td>
</tr>
<tr>
<td><input type="hidden" name="id[]" value="2"/></td>
<td><input type="text" name="attr[]" /></td>
<td><input type="textarea" name="number[]" /></td>
</tr>
<tr>
<td><input type="hidden" name="id[]" value="3"/></td>
<td><input type="text" name="attr[]" /></td>
<td><input type="textarea" name="number[]" /></td>
</tr>
</form>每次只post 改动过的一个<tr>的数据，（3个数组）

Answer 8

监听 onchange 事件不可以么？

Answer 9

可以  就是说如果提交的数据很多而只想提交修改过的哪行值，
    [id] => Array
        (
            [0] => 635
            [1] => 636
            [2] => 638
        )    [price] => Array
        (
            [0] => 288.35
            [1] => 380.85
            [2] => 83.85
        )    [number] => Array
        (
            [0] => 1
            [1] => 1
            [2] => 1
        )
这是3行，有200行的类似数据 ，所以 当我改了第一行的值我怎么在后台拿到 同样结构的 每个数组只有 第[0]个元素这样的数据， [id] => Array
        (
            [0] => 635
        )    [price] => Array
        (
            [0] => 288.35
        )    [number] => Array
        (
            [0] => 1
        )也就过滤了未改动的值避免提交了.就是js里处理我用了楼上 @crying_boy 老兄的IsFormChanged了，改造为成功