我如何在console.log中如何发送#form值？

Question

我知道我们可以通过其选择器手动记录任何输入值

console.log('inputName='+$('#inputId').val()+'....)

但是，是否有 - 简单 - 记录所有输入值的方法？ 如果在任何输入改变时可以做到这一点

Answer 1

您可以使用serialize化将表单元素serialize化为字符串以进行日志记录。 它遵循与包括或不包括正常表单提交的元素相同的规则。 唯一需要注意的是input type="file"字段的内容未被序列化，原因可能是显而易见的原因。

在任何输入更改时触发它：

$("form :input").change(function() {
    console.log($(this).closest('form').serialize());
});

使用文档中显示的表单进行现场演示

Answer 2

我做了这个小组件：

$("form :input").change(function() {  
    var fields = $(this).closest('form').serialize();
    serialize_to_console( fields );
 });


/*
  SERIALIZE TO CONSOLE
  Transforms string to array and show each param in console if not empty */
var serialize_to_console = function( serialized ) { 

    var splited_serialized = serialized.split('&');

    $.each( splited_serialized, function(index, key) { 

        var input = key.substr(0, key.indexOf('=')); 
        var value = key.substr( key.indexOf('=') + 1 ); 

        if( value !== '' )
        console.log( '[' + input + '] = \'' + value + '\'' );
    });

}

请享用！

Answer 3

您可以使用$("form").serialize()获取查询字符串的$("form").serialize() 。

Answer 4

每次发生任何变化时，都会记录表单：

$("form :input").change(function(){
   console.log($("form").serialize());
});

编辑：

删除了我的焦点建议，因为我意识到实际上只有在元素失去焦点时才会触发更改。