Question

我正在创建一个搜索表单，它从表单输入中获取数据属性，创建一个数组，然后将其转换为字符串以发送到API搜索调用。

我的HTML是：

        <input data-group="filters" data-param="month">
        <input data-group="filters" data-param="year">            
        <input data-group="filters" data-param="name">
        <button data-input="filters" id="search">Search</button>

我的JS是：

 $('#search').on('click', function () {    
        var input_group = $(this).data('input');
        var inputs = $('input[data-group="' + input_group + '"]');
        var values = [];        
        $(inputs).each(function () {
            values.push($(this).data("param"));
            values.push($(this).val());     
        });    
        str = values.join([separator = '&']);
        str = 'http://www.example.com/search/?' + str;
    });
});

str目前读取：

http://www.example.com/search/month&January&year&2015&name&Jane

但我想要的是：

http://www.example.com/search/?month=January&year=2015&name=Jane

如何在=和month之间插入January，然后使用&进行跟进？

Answer 1

您确定无法使用输入name属性吗？如果是这样，你可以简单地使用jQuery＆＃39; serialize。

如果您需要继续使用目前所拥有的内容，那么您看到此行为的原因是因为您要将名称和值都添加到同一个数组中：

values.push($(this).data("param"));
values.push($(this).val());

...然后以&作为分隔符加入它们。

您需要添加=添加项目的位置：

values.push(
   $(this).data("param") + "=" + $(this).val()
);

Answer 2

 $('#search').on('click', function () {    
        var input_group = $(this).data('input');
        var inputs = $('input[data-group="' + input_group + '"]');
        var values = [];        
        $(inputs).each(function () {
            // Differences start
            var full_parameter = values.push($(this).data("param")); 
            full_parameter += '=';
            full_parameter += $(this).val();

            values.push(full_parameter); 
            // Differences end    
        });    
        str = values.join([separator = '&']);
        str = 'http://www.mysite.com.au/search/?' + str;
    });
});

Answer 3

您可以使用

来实现它

$(inputs).each(function () {
    values.push($(this).data("param") + "=" + $(this).val());
});

而不是

$(inputs).each(function () {
    values.push($(this).data("param"));
    values.push($(this).val());     
});

Jquery从输入数据属性创建字符串

3 个答案: