javascript - Woocommerce Ajax过滤器和复选框

我有这样的结构

牌


谷歌
苹果
微软


材料


木
金属
普拉斯蒂克


基本上是品牌和材料-是Woocomerce属性，其余是变量。

我现在正在处理ajax过滤器，我需要url看起来像这样

http://example.com/shop?filter_brand=122,123&filter_material=134,45。

这是到目前为止我所拥有的code

的HTML

<ul class="dd" data-termik="men">
    <li>
        <label for="">Men</label>
        <input class="ajax-checkbox" data-term="men" data-id="31" type="checkbox">
    </li>
    <li>
        <label for="">Boys</label>
        <input class="ajax-checkbox" data-term="men" data-id="54" type="checkbox">
    </li>
    <li>
        <label for="">Robots</label>
        <input class="ajax-checkbox" data-term="men" data-id="76" type="checkbox">
    </li>
</ul>

<hr>

<ul class="dd" data-termik="women">
    <li>
        <label for="">Women</label>
        <input class="ajax-checkbox" data-term="women" data-id="12" type="checkbox">
    </li>
    <li>
        <label for="">Girls</label>
        <input class="ajax-checkbox" data-term="women" data-id="38" type="checkbox">
    </li>
    <li>
        <label for="">Barbies</label>
        <input class="ajax-checkbox" data-term="women" data-id="19" type="checkbox">
    </li>
</ul>

JS

$(document).on('change', '.ajax-checkbox', function(e) {

    var str = $(".ajax-checkbox:checked").map(function() {
        var term = $(this).data('term');

        var term_ids = [];
        $('.ajax-checkbox:checked').each(function(index, value) {
            var term_id = $(this).data('id');
            term_ids.push(term_id);
        });
        term_ids_unique = $.unique(term_ids);

        return term + '=' + term_ids_unique;

    }).get();

    var uniqueArray = str.filter(function(elem, pos) {
        return str.indexOf(elem) == pos;
    });


    // FINAL URL
    var final_url = uniqueArray;
    console.log(final_url);

});

但它无法正常工作。

最佳答案

终于成功了。 DEMO

JS

$(document).on('change', '.ajax-checkbox', function(e) {
    var final_url = '', uniqueArray, selected = {};
  $('.ajax-checkbox:checked').each(function(index,value) {
    var data = $(this).data();
    if (typeof selected[data.term] === "undefined") {
      selected[data.term] = [];
    }
    selected[data['term']].push(data.id);
  });
    for (prop in selected) {
    if (final_url) {
      final_url += '&';
    }
    final_url += prop + '=';
    final_url += selected[prop].join(',');
  }

  console.log(final_url);

});