Question

我有json数据。

[
["Fruit","Lychee Magic","Dusk"],
["Veggies","Long Beans","Rampage"],
["Fruit","Mango Aroma Sweet","Dawn"]
]

我有按钮。按钮文本的第一部分类似于json数据。

<button type="button" class="mood">Mango</button>
<button type="button" class="mood">Lychee</button>

如何将按钮文本与json数据匹配并将整行输入数组？

var butTxArr = [];
$("#intoArr").click(function(){
    $('.mood').each(function(){
       var obj = //how to match?
       butTxArr.push(obj);   
    })
});

例外输出：

butTxArr = ["Fruit","Lychee Magic","Dusk", "Fruit","Mango Aroma Sweet","Dawn"];

Answer 1

这样的东西？

$("#intoArr").click(function () {
    var butTxArr = [];
    $('.mood').each(function () {
        // trim button text
        var text = $(this).text().replace(/^\s*/g, '').replace(/\s*$/g, '');
        data.forEach(function (row) {
            // see if the row contains the text
            if (row.toString().indexOf(text) !== -1)
                // append to array
                butTxArr = butTxArr.concat(row);
        })
    })
    // we're done!
    console.log(butTxArr)
});

＆＃13;

$(document).ready(function() {
  var data = [
    ["Fruit", "Lychee Magic", "Dusk"],
    ["Veggies", "Long Beans", "Rampage"],
    ["Fruit", "Mango Aroma Sweet", "Dawn"]
  ];

  $("#intoArr").click(function() {
    var butTxArr = [];
    $('.mood').each(function() {
        // trim button text
        var text = $(this).text().replace(/^\s*/g, '').replace(/\s*$/g, '');
        data.forEach(function(row) {
          // see if the row contains the text
          if (row.toString().indexOf(text) !== -1)
          // append to array
            butTxArr = butTxArr.concat(row);
        })
      })
      // we're done!
    alert(butTxArr)
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" class="mood">Mango</button>
<button type="button" class="mood">Lychee</button>

<button id="intoArr">Show</button>

＆＃13;

Answer 2

我会接近这样的事情：

var butTxArr = [];

// create a temporary array
var temp = [];
$("#intoArr").click(function () {
    $('.mood').each(function () {

        // grab the text from the mood class
        var txt = $(this).text();

        // loop over the data array
        for (var i = 0, l = arr.length; i < l; i++) {

            // use `some` to check to see if the text appears
            // in any of the element, and if it does, add it
            // to the temporary array
            var found = arr[i].some(function (el) { return el.indexOf(txt) > -1; });
            if (found) temp.push(arr[i]);
        }
    });

    // flatten the temporary array
    butTxArr = [].concat.apply([], temp);
});

DEMO

Answer 3

你可以这样做：

$("#intoArr").click(function(){     
    $('.mood').each(function(){
        for (var i=0;i<array.length;i++) {            
            if(array[i].toString().indexOf($(this).text()) > -1) {                
                butTxArr.push(array[i]);                   
            }
        }              
    })

    for (var a=0;a<butTxArr.length;a++) {
        alert(butTxArr[a]);
    }
});

演示here。

Answer 4

您可以使用 .filter（）方法，通过功能方式使用高阶函数。因此，您可以创建函数生成器，使代码更可重用，更清晰。

  //Create a function generator to filter our array
  function filterBy(filter){
    return function(elm){
      return elm.join('').indexOf(filter) > -1;
    }
  }

  var filtered = [];

    $('#intoArr').click(function(){

      $('.mood').each(function(){

      //Retrieve text param
      var txt = $(this).text();

      //Filter our array by using high order function and filter method
      //and push it into our filtered array
      filtered.push(array.filter(filterBy(txt))[0]);

    });

    //Flat the result
    filtered = [].concat.apply([], filtered);

    console.log(filtered)

  });

通过匹配文本将json数据输入到数组中

4 个答案: