【问题标题】:jquery arrays intersectjquery数组相交
【发布时间】:2011-04-29 13:03:57
【问题描述】:

我之前将此问题发布为 jquery/javascript:arrays - jquery/javascript: arrays。 但是由于我是一个完整的初学者,所以我提出了错误的问题并且也没有理解答案.... :(

在未能实施给定的解决方案后,我又环顾四周,发现我需要比较 6 个可能的选择数组并将它们相交以最终仅显示重叠的值。

所以,希望这是一个更清晰的表述:

我有 6 个问题/6 组单选按钮用于回答。每个答案都有多个值(它们的范围可以从 1 到 38 个项目显示在最终的“建议”中)。我正在数组中收集检查过的收音机的值。我得到6个数组。

如何使 6 个数组相交以得到一个最终数组,该数组仅包含来自所有 6 个选项的相交值? 如何将这个最终数组的项目转换为选择器?

有人可以帮帮我吗? 谢谢!

我的脚本现在看起来像:

(function($){
  $.fn.checkboxval = function(){
      var outArr = [];
      this.filter(':checked').each(function(){
            outArr.push(this.getAttribute("value"));
      });
      return outArr;
  };
})
(jQuery);
$(function(){
  $('#link').click(function(){
    var valArr1 = $('#vraag1 input:radio:checked').checkboxval();
    var valArr2 = $('#vraag2 input:radio:checked').checkboxval();
    var valArr3 = $('#vraag3 input:radio:checked').checkboxval();
    var valArr4 = $('#vraag4 input:radio:checked').checkboxval();
    var valArr5 = $('#vraag5 input:radio:checked').checkboxval();
    var valArr6 = $('#vraag6 input:radio:checked').checkboxval();
// var newArray = $.merge(valArr1, valArr2, valArr3, valArr4, valArr5, valArr6); <- test to see if I can merge them
// $('#output').text(newArray.join(',')); <- test to see if I can join them
//$("#output").html($("#output").html().replace(/,/gi, ',#diet')); <- test to see if I can append text so it looks like the selectors of divs I need to display later
//    return false;
  });
});

我的表单/输入看起来像:

<input name="vraag1" type="radio" value="1a,4,5,12,13,17a,18,19,22,23,24,26,27,28,29,30,33,38,6" class="radio advice" id="vraag1-0" /><label for="vraag1-0">ja</label>
<br />
<input name="vraag1" type="radio" value="1b,1,2,3,7,8,11,9,14,15,16,17,20,21,25,31,34,35,36,37,10,32" class="radio advice" id="vraag1-1" /><label for="vraag1-1">nee</label>
<br />
<input name="vraag1" type="radio" value="1c,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,17a,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38" class="radio advice" id="vraag1-2" /><label for="vraag1-2">maakt mij niet uit</label>

【问题讨论】:

  • 这不是 $('#vraagX input:radio:checked').val();而不是 checkboxval() ?
  • @mplungjan: 当我改变 var valArr1 = $('#vraag1 input:radio:checked').checkboxval();到 var valArr1 = $('#vraag1 input:radio:checked').val();它不返回任何值
  • 对不起,我评论的时候你有checkboxval功能吗????如果是这样我的坏。但是它会过滤,所以对它的调用也是如此,所以至少这是一种浪费
  • 没关系。是的,我同意你的看法,但由于缺乏更好的知识,我把它放在一起。关于如何相交 6 个数组的任何提示?谢谢。

标签: javascript jquery arrays forms intersect


【解决方案1】:

加载jQuery后,就可以在控制台打卡了:

a1=[1,2,3]
a2=[2,3,4,5]
$.map(a1,function(a){return $.inArray(a, a2) < 0 ? null : a;})

输出应该是:

[2, 3]

【讨论】:

    【解决方案2】:

    只是想知道同样的事情并想出了这个:

    $(["a","b"]).filter(["a","c"])
    

    返回

    ["a"]
    

    【讨论】:

    • 太棒了!这是.filter 的预期应用吗?
    • @david-john-smith 上面的符号没有记录,但记录的是.filter 接受另一个 jQuery 对象作为参数。所以$(["a","b"]).filter($(["a","c"])) 是完全合法的。
    • @Christoph 提到的文档:api.jquery.com/filter/#filter-selection
    【解决方案3】:

    如果你想对数组做相交操作,你可以使用 jQuery 插件jQuery Array Utilities

    这是一个如何使用它的示例代码行:

    $.intersect([1, 2, 2, 3], [2, 3, 4, 5, 5])
    

    将返回结果[2,3]

    【讨论】:

    • 我工作得很好,但你有一个拼写错误:相交,不是相交
    • 感谢您的评论 :) 我已对答案进行了更正
    • 这个intersect函数也支持任意数量的数组,这个包jquery-array-utilities也可以使用bower安装。我想添加一个我最初制作插件的免责声明 :)
    【解决方案4】:

    你的问题还是让我很困惑。

    但您似乎正在从输入中获取价值并尝试将它们组合起来。但它们都是字符串而不是数组。

    尝试将字符串加在一起,然后使用split() (demo) 将它们分开

    $('#link').click(function() {
        var radios = '';
        $('input:radio:checked').each(function() {
            radios += $(this).val() + ',';
        })
        // remove last comma & convert to array
        radios = radios.substring(0, radios.length - 1).split(',');
        // do something with the array
        console.debug(radios);
    })
    

    更新:好的,从您的演示 HTML 中,我无法获得 6 个重复项,因此在演示中我将其设置为查找 3+ 个匹配项。我必须编写这个脚本来查找数组中的重复项,我还让它返回一个具有重复项数量的关联对象。可能有更好的方法,但这是我想出的(updated demo):

    $(function() {
        $('#link').click(function() {
            var radios = '';
            $('input:radio:checked').each(function() {
                radios += $(this).val() + ',';
            })
            // remove last comma & convert to array
            var results = [],
                dupes = radios
                 .substring(0, radios.length - 1)
                 .split(',')
                 .getDuplicates(),
                arr = dupes[0],
                arrobj = dupes[1],
                minimumDuplicates = 6; // Change this to set minimum # of dupes to find
    
            // find duplicates with the minimum # required
            for (var i=0; i < arr.length; i++){
                if ( arrobj[arr[i]] >= minimumDuplicates ){
                    results.push(arr[i]);
                }
            }
    
            // Show id of results
            var diets = $.map(results, function(n,i){ return '#diet' + n; }).join(',');
            $(diets).show(); // you can also slideDown() or fadeIn() here
        })
    });
    
    
    /* Find & return only duplicates from an Array
     * also returned is an object with the # of duplicates found
     * myArray = ["ccc", "aaa", "bbb", "aaa", "aaa", "aaa", "aaa", "bbb"];
     * x = myArray.getDuplicates();
     * // x = [ array of duplicates, associative object with # found]
     * // x = [ ['aaa','bbb'] , { 'aaa' : 5, 'bbb' : 2 } ]
     * alert(x[0]) // x[0] = ['aaa','bbb'] & alerts aaa,bbb
     * alert(x[1]['aaa']) // alerts 5;
     */
    Array.prototype.getDuplicates = function(sort) {
        var u = {}, a = [], b = {}, c, i, l = this.length;
        for (i = 0; i < l; ++i) {
            c = this[i];
            if (c in u) {
                if (c in b) { b[c] += 1; } else { a.push(c); b[c] = 2; }
            }
            u[c] = 1;
        }
        // return array and associative array with # found
        return (sort) ? [a.sort(), b] : [a, b];
    }
    

    【讨论】:

    • @fudgey:谢谢你的反应!我的目标是最终从这 6 个输入中仅获得重叠的值/字符串。如果我理解正确,我需要拆分字符串,这会给我价值吗?我希望我知道如何运行你的代码,虽然......我为我的菜鸟道歉......几乎把我的头发拉到这里......
    • 你看演示了吗?另外,当您说重叠时,您的意思是所有 6 个组都需要具有相同的数字吗?...这是令人困惑的地方,因为您的示例 HTML(其他问题)在输入中只有一个值,而您上面的代码有不止一个。
    • 是的,只需要返回所有 6 个组中出现的数字(或更多数字)。有 6 组收音机,第二组是:


    • 你在做什么用“17”和“17a”他们认为是一样的吗?您的问题令人困惑的原因就像您刚刚放入 cmets 的 HTML 一样......这些值是否应该代表已检查的答案?如果你把那个 HTML 放到 demo 中,你一次只能检查一个收音机,所以没有办法得到 6 个重复。
    【解决方案5】:

    请参阅Simplest code for array intersection in javascript 了解交集功能。使用 split(",") 拆分字符串,并对结果字符串数组进行交集。

    【讨论】:

      【解决方案6】:
      function intersect(a, b) {
          var aIsShorter = a.length < b.length;
          var shorter = aIsShorter ? a : b;
          var longer = aIsShorter ? b : a;
      
          return longer.filter(isFoundInOther).filter(isFoundOnce);
      
          function isFoundInOther(e) {
              return shorter.indexOf(e) !== -1;
          }
      
          function isFoundOnce(element, index, array) {
              return array.indexOf(element) === index;
          }
      }
      

      【讨论】:

      • 注意为您的代码添加解释以及它如何回答 OP 的问题?
      猜你喜欢
      • 1970-01-01
      • 2013-07-22
      • 2011-03-03
      • 2010-11-02
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-02-19
      • 2015-11-20
      相关资源
      最近更新 更多