Question

是否可以并以循环方式检查html格式的每个输入文本字段？例如，form有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的所有其他字段

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

抱歉我的英文不好，并提前感谢你。

Answer 1

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

Answer 2

由于你的标签有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;
});

Foreach if语句循环形式javascript

2 个答案: