Question

我想循环遍历所有填写的表单项，输入，选择，广播，复选框等以提取值。

以下代码效果很好

var fields = $(":input").serializeArray();
$("#results").empty();
jQuery.each(fields, function(i, field){
$("#results").append(field.value + " ");

但是，我想在返回的值中附加多个属性，例如name，id，title等。不幸的是，我在这方面的尝试让我无处可去。

var fields = $(":input").serializeArray();
$("#results").empty();
jQuery.each(fields, function(i, field){
var vTitle = $(each).attr('title');
$("#results").append(vTitle + " " + field.value + " ");

不起作用

任何帮助将不胜感激

欢呼声

编辑... 感谢您的输入，但返回的内容是“未定义”。这是我正在使用的HTML

编辑显示所有内容

结果：

<form>
<select title="Staff:" name="single">
  <option>Single</option>
  <option>Single2</option>
  <option>Single3</option> 
 </select>
 <select name="multiple" multiple="multiple">
  <option selected="selected">Multiple</option>
  <option>Multiple2</option>

  <option selected="selected">Multiple3</option>
 </select><br/>
 <input title="Staff:" type="checkbox" name="check" value="check1" id="ch1"/>

 <label for="ch1">check1</label>
 <input type="checkbox" name="check" value="check2" checked="checked" id="ch2"/>

 <label for="ch2">check2</label>
 <input type="radio" name="radio" value="radio1" checked="checked" id="r1"/>

 <label for="r1">radio1</label>
 <input type="radio" name="radio" value="radio2" id="r2"/>

 <label for="r2">radio2</label>
</form>
<script>
function showValues() {
var fields = $(":input");
$("#results").empty();
jQuery.each(fields, function(i, v){
$("#results").append(v.title + " " + v.value + " ");
});
}

$(":checkbox, :radio").click(showValues);
$("select").change(showValues);
showValues();
</script>

</body>

我需要看到'staff：'附加到选择值

这对我有用

function showValues() {
var fields = $(":input");
$("#results").empty();
var val;

jQuery.each(fields, function (i, v) {
        // if doesn't have checked property then get value - 
        // if checked return value 
        // else return empty string
        val = this.checked == undefined ? this.value : this.checked ? this.value : "";    
    if (val != ''){
            $("#results").append(v.title + " " + val + " " + v.id + "<br/> ");
    }
});
}
$("select,:checkbox, :radio").change(showValues);
showValues();

这循环遍历表单元素，并且仅当元素具有值时才返回元素值和标题属性...非常感谢@wirey

Answer 1

你在上一个循环中犯了一个错误：

var fields = $(":input");
$("#results").empty();
jQuery.each(fields, function(i, field){
    var vTitle = $(this).attr('title'); // each should be called this
    $("#results").append(vTitle + " " + field.value + " ");
    });

Answer 2

而不是：

var vTitle = $(each).attr('title');

DO

var vTitle = $(field).attr('title');

Answer 3

如果您想要访问名称/值以外的其他属性，请不要使用.serializeArray()。 jQuery docs声明了这个

将一组表单元素编码为名称和值的数组。

var fields = $(":input");
$("#results").empty();
jQuery.each(fields, function(i, v){
   $("#results").append(v.title + " " + v.value + " ");
});

FIDDLE

jquery循环表单项返回带有title，id的值

3 个答案: