Foreach if语句循环通过表单javascript - Foreach if statement loop through form javascript

Foreach if statement loop through form javascript

是否可以循环检查html表单中的每个输入文本字段？例如，表单有8个预定义值为0的输入字段。

表单代码：

<form method="post" action="" id="form"> 
<input type='text' name="One"  id="one" value='0'>
<input type='text' name="Two"  id="two" value='0'>
<input type='text' name="Three"  id="three" value='0'>
<input type='text' name="Four"  id="four" value='0'>
<input type='text' name="Five"  id="five" value='0'>
<input type='text' name="Six"  id="six" value='0'>
<input type='text' name="Seven"  id="seven" value='0'>
<input type='text' name="Eight"  id="eight" value='0'>
</form>

当用户将其中一些值更改为任何其他大于0的数值并单击提交按钮时，循环会检查每个输入值，如果是value!=0，脚本会收集新值及其输入名称，然后将其发布到数据库中。

例如，如果名为"One"的输入字段获得新值"2"，而名为"Five"的输入域获得了新值"1"，则脚本将在数据库One 2; Five 1;中发布，并跳过所有其他值为0的字段。

或者用表格而不是输入字段来创建表单会更容易吗？

抱歉我英语不好，提前谢谢你。

由于您的标记具有jquery，因此这里有一种jquery方法来拦截提交并只发布更改后的值。您将替换输出要发布的文本的部分。请参阅更新的fiddle。

Html:

<form method="post" action="" id="form"> 
    <input type='text' class='textInput' name="One"  id="one" value='0'>
    <input type='text' class='textInput' name="Two"  id="two" value='0'>
    <input type='text' class='textInput' name="Three"  id="three" value='0'>
    <input type='text' class='textInput' name="Four"  id="four" value='0'>
    <input type='text' class='textInput' name="Five"  id="five" value='0'>
    <input type='text' class='textInput' name="Six"  id="six" value='0'>
    <input type='text' class='textInput' name="Seven"  id="seven" value='0'>
    <input type='text' class='textInput' name="Eight"  id="eight" value='0'>
    <input type="submit" id='submit' value="Submit">
</form>
<p id='output'></p>

Javascript：

$('form').submit(function(){    
    $('.textInput').each(function(){ 
        if($(this).val() != '0')
        {
            $('#output').text($('#output').text()+ ' ' + $(this).attr('name') + ':' + $(this).attr('value') );
        }
    });
    return false;
});

var inputs = document.getElementById('form').children;
var data = {};
for(var i in inputs ){
    if(inputs[i].value != 0)data[inputs[i].name] = inputs[i].value;
}
// do Post-Request with XHR here using data which holds all values