使用选中的输入获取所有不重复的 "pair" 组合

Get all non repeated "pair" combination using checked input

我需要将所有未重复的可能组合用作输入标记的复选框。这是我正在处理的代码:

$('#triggerEv').on('click', function () {
    var firstTblItems = $("#firstTbl").find("input[type='checkbox']:checked"),
        secondTblItems = $("#secondTbl").find("input[type='checkbox']:checked"),
        i = 0,
        j = 0,
        itemsArr = [],
        currPair;

  for (i; i < firstTblItems.length; i++) {
    for (j; j < secondTblItems.length; j++) {
      currPair = firstTblItems.eq(i).val() + '_' + secondTblItems.eq(j).val();
      if (itemsArr.indexOf(currPair) === -1) {
        itemsArr.push(currPair);
      }
    }
  }

  console.log(itemsArr);
});

在这种情况下,如果你检查所有这些,正确的输出应该是:

itemsArr = [
        "1_1",
        "1_2",
        "1_3",
        "1_4",
        "2_1",
        "2_2",
        "2_3",
        "2_4",
];

获取文本应该是这样的:

Item 1 - Item 1
Item 1 - Item 2
Item 1 - Item 3
Item 1 - Item 4
Item 2 - Item 1
Item 2 - Item 2
Item 2 - Item 3
Item 2 - Item 4

但我明白了:

itemsArr = ["1_1", "1_2", "1_3", "1_4"];

哪里错了,我的代码可以得到一些帮助吗? Here是一个Fiddle用来玩的。

您并不是每次都重新初始化 j 循环。在第一个外循环之后,j 永远停留在 secondTblItems.length,因此内循环再也不会运行。

只需更正循环初始化,替换为:

for (i; i < firstTblItems.length; i++) {
  for (j; j < secondTblItems.length; j++) {

与:

for (i = 0; i < firstTblItems.length; i++) {
  for (j = 0; j < secondTblItems.length; j++) {

$('#triggerEv').on('click', function() {
  var firstTblItems = $("#firstTbl").find("input[type='checkbox']:checked"),
    secondTblItems = $("#secondTbl").find("input[type='checkbox']:checked"),
    i,
    j,
    itemsArr = [];

  for (i = 0; i < firstTblItems.length; i++) {
    for (j = 0; j < secondTblItems.length; j++) {
      var currPair = firstTblItems.eq(i).val() + '_' + secondTblItems.eq(j).val();
      if (itemsArr.indexOf(currPair) === -1) {
        itemsArr.push(currPair);
      }
    }
  }

  console.log(itemsArr);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>First table</div>
<table width="100%" border="1" cellpadding="0" cellspacing="0" id="firstTbl">
  <tr>
    <td>
      <input type="checkbox" name="manufacturer[]" id="man-1" value="1" />
    </td>
    <td>Item 1</td>
  </tr>
  <tr>
    <td>
      <input type="checkbox" name="manufacturer[]" id="man-2" value="2" />
    </td>
    <td>Item 2</td>
  </tr>
  <tr>
    <td>
      <input type="checkbox" name="manufacturer[]" id="man-5" value="3" />
    </td>
    <td>Item 3</td>
  </tr>
  <tr>
    <td>
      <input type="checkbox" name="manufacturer[]" id="man-4" value="4" />
    </td>
    <td>Item 4</td>
  </tr>
</table>
<div>Second table</div>
<table width="100%" border="1" cellpadding="0" cellspacing="0" id="secondTbl">
  <tr>
    <td>
      <input type="checkbox" name="branch[]" id="branch-1" value="1" />
    </td>
    <td>Item 1</td>
  </tr>
  <tr>
    <td>
      <input type="checkbox" name="branch[]" id="branch-2" value="2" />
    </td>
    <td>Item 2</td>
  </tr>
  <tr>
    <td>
      <input type="checkbox" name="branch[]" id="branch-5" value="3" />
    </td>
    <td>Item 3</td>
  </tr>
  <tr>
    <td>
      <input type="checkbox" name="branch[]" id="branch-4" value="4" />
    </td>
    <td>Item 4</td>
  </tr>
</table>
<div>Result table</div>
<table width="100%" border="1" cellpadding="0" cellspacing="0" id="resultTbl"></table>
<button id="triggerEv">Combine values</button>