Question

这是实时搜索脚本。 Livesearch可以正常工作，但不能获取每个数组数据。我想获取每个searchComponent的“名称”，“代码”和“位置”数据。

更新

这是js的完整代码。

https://jsfiddle.net/blueink/wyejqhsz/3/

我已经有$ data数组，所以我想将这些项目添加到IT中。

<div id="searchComponent-1">
    <div class="btn-group">
        <input type="text" name="search" placeholder="input 1" class="search form-control" size="3000"
               onkeypress="return event.keyCode!=13"/>
        <span class="searchclear glyphicon glyphicon-remove-circle"></span>
    </div>

    <ul class="list-group result"></ul>
</div>
<div id="searchComponent-2">
    <div class="btn-group">
        <input type="text" name="search" placeholder="input 2" class="search form-control" size="3000"
               onkeypress="return event.keyCode!=13"/>
        <span class="searchclear glyphicon glyphicon-remove-circle"></span>
    </div>
    <ul class="list-group result"></ul>
</div>

jQuery

searchWrapper.find('.result').after('<input type="hidden" name="name" value="' + name + '">');
searchWrapper.find('.result').after('<input type="hidden" name="code" value="' + code + '">');
searchWrapper.find('.result').after('<input type="hidden" name="location" value="' + location + '">');


$(document).ready(function () {
   //then apply same method on each element
    $("#searchComponent-1").searchAndDisplay(); 
    $("#searchComponent-2").searchAndDisplay();
}

Answer 1

我认为您的dom将具有以下输入数据：

  <ul class="list-group result">
    <input type="hidden" name="name" value="Name2">
    <input type="hidden" name="code" value="Code2">
    <input type="hidden" name="location" value="Location2">
  </ul>

您可以执行以下操作以获得所需的结果：

$(document).ready(function() {
  var result_array = []
  $('.result').each(function() {
    var name = $(this).find("input[name='name']").val();
    var code = $(this).find("input[name='code']").val();
    var location = $(this).find("input[name='location']").val();
    result_array.push([name, code, location])
  });

  console.log('As Array:')
  console.log(result_array)

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="searchComponent-1">

  <div class="btn-group">
    <input type="text" name="search" placeholder="input 1" class="search form-control" size="3000" onkeypress="return event.keyCode!=13" />
    <span class="searchclear glyphicon glyphicon-remove-circle"></span>
  </div>

  <ul class="list-group result">
    <input type="hidden" name="name" value="Name1">
    <input type="hidden" name="code" value="Code1">
    <input type="hidden" name="location" value="Location1">
  </ul>
</div>
<div id="searchComponent-2">

  <div class="btn-group">
    <input type="text" name="search" placeholder="input 2" class="search form-control" size="3000" onkeypress="return event.keyCode!=13" />
    <span class="searchclear glyphicon glyphicon-remove-circle"></span>
  </div>

  <ul class="list-group result">
    <input type="hidden" name="name" value="Name2">
    <input type="hidden" name="code" value="Code2">
    <input type="hidden" name="location" value="Location2">
  </ul>
</div>

如果要在一维数组中获得结果，可以执行以下操作：

result_array.push(name, code, location)

输出将是：

["Name1", "Code1", "Location1", "Name2", "Code2", "Location2"]

如何使用此代码接收数组数据？

1 个答案: