javascript - Foreach if 语句通过表单 javascript 循环

Question

是否可以循环检查 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;五个 1; 并跳过所有其他值为 0 的字段。

或者使用表格而不是输入字段创建表单来执行此操作可能更容易吗？

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

Answer 1

由于您的标签具有 jquery，因此这里有一种 jquery 方法来拦截提交并仅发布更改的值。您将替换输出要发布的文本的部分。请参阅此 updated 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;
});