我如何使用jQuery的form.serialize但排除空字段

Question

我有一个搜索表单,其中包含许多通过GET提交的文本输入和下拉菜单.我想通过在执行搜索时从查询字符串中删除空字段来获得更清晰的搜索URL.

var form = $("form");  
var serializedFormStr = form.serialize();  
// I'd like to remove inputs where value is '' or '.' here
window.location.href = '/search?' + serializedFormStr

知道如何使用jQuery做到这一点？

Answer 1

我一直在查看jQuery文档,我认为我们可以使用选择器在一行中执行此操作:

$("#myForm :input[value!='']").serialize() // does the job!

很明显,#myForm获取了id为"myForm"的元素,但最初对我来说不太明显的是#myForm和:input之间需要空格字符,因为它是后代运算符.

:input匹配所有input,textarea,select和button元素.

[value!='']是一个不等于过滤器的属性.奇怪的(也是有用的)是 all:input元素类型具有值属性,甚至是选择和复选框等.

最后还删除值为'.'的输入.(如问题中所述):

$("#myForm :input[value!=''][value!='.']").serialize()

在这种情况下,并置,即将两个属性选择器彼此相邻放置,意味着AND.使用逗号表示OR.对不起,如果那对CSS人来说很明显!

Answer 2

我无法让Tom的解决方案工作(？),但我能够使用.filter()短函数来识别空字段.我正在使用jQuery 2.1.1.

var formData = $("#formid :input")
    .filter(function(index, element) {
        return $(element).val() != '';
    })
    .serialize();

Answer 3

这对我有用:

data = $( "#my_form input").filter(function () {
        return !!this.value;
    }).serialize();

Answer 4

你可以用正则表达式来做...

var orig = $('#myForm').serialize();
var withoutEmpties = orig.replace(/[^&]+=\.?(?:&|$)/g, '')

测试用例:

orig = "a=&b=.&c=&d=.&e=";
new => ""

orig = "a=&b=bbb&c=.&d=ddd&e=";
new => "b=bbb&d=ddd&"  // dunno if that trailing & is a problem or not