Question

我有一个带有值的字符串对象：

dictionary={ 
 1: ["a1+b+c"],
 2: ["a1+c+v"], 
 3: ["a1+z+e"], 
 4: ["a2+p+a"], 
 5: ["a2+z+v"], 
 6: ["a3+q+v"], 
 ...};

我有一个页面，其中包含对象中每个部分字符串值的复选框，例如复选框“a”，“b”，“c”，...等。在页面上，复选框位于组a1，a2，a3等中。

      <p><div id="displayString">
      </div></p>


<table>
         <table class="table table-striped">
          <thead>
            <tr>
              <th>a1</th>
              <th>a2</th>
              <th>a3</th> 
              <th>a4</th>
              <th>a5</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td><label><input type="checkbox" name="selected" value="a" class="a1" />a</label></td>
              <td><label><input type="checkbox" name="selected" value="a" class="a2" />a</label></td>
              <td><label><input type="checkbox" name="selected" value="a" class="a3" />a</label></td>
              <td><label><input type="checkbox" name="selected" value="a" class="a4" />a</label></td>
             <td><label><input type="checkbox" name="selected" value="a" class="a5" />a</label></td>
              </tr>
            <tr>
              <td><label><input type="checkbox" name="selected" value="b" class="a1" />b</label></td>
              <td><label><input type="checkbox" name="selected" value="b" class="a2" />b</label></td>
              <td><label><input type="checkbox" name="selected" value="b" class="a3" />b</label></td>
              <td><label><input type="checkbox" name="selected" value="b" class="a4" />b</label></td>
             <td><label><input type="checkbox" name="selected" value="b" class="a5" />b</label></td>
              </tr>
      ...

我需要根据所选复选框的值按部分值过滤字典，例如，当在组a1中选择“c”时，它将返回：

 1: a1+b+c
 2: a1+c+v

从组a2中选择“z”时，它将返回：

 5: "a2+z+v"

我拥有的代码（每个组的功能）是：

$(function(){
$(".a1").on("click", function(){
  var arr = $(".a1:checked").map(function(){
      return $(this).val();
    }).get();
  $('#displayString').html(arr);  
})
})

此代码仅显示所选值。有什么方法可以创建部分查找并将所有匹配项列在另一个下面？

Answer 1

尝试这样的事情。这对你有帮助吗？

基本上，我们使用join，filter和map方法根据复选框的值搜索字典元素，以查找有效匹配。

我们也可以使用reduce做同样的事情，但我想是很难解释。

首先，我们使用split方法拆分字符串。因此a1+b+v变为[＆＃39; a1＆＃39;，＆＃39; b＆＃39;＆＃39; v＆＃39;]。这是必要的步骤，因为如果我们只是在字符串中直接搜索而不进行拆分，a1 a将匹配字符串。因为这两个都存在于字符串中。相反，我们将它们分开并进行完全匹配。因此，只有a1和b匹配所述字符串。

然后，我们使用这些匹配的索引并在最后一步获取原始字符串。希望它能帮助你。

＆＃13;

var dictionary=[
  "a1+b+c",
  "a1+c+v", 
  "a1+z+e", 
  "a2+p+a", 
  "a2+z+v", 
  "a3+q+v", 
 ];
 
var splitDictionary = dictionary.map(item => item.split("+"))

$("#my-table [type='checkbox']").change(function(){
  if(this.checked){
     const value = this.value;
     const className = $(this).attr('class');
     const filteredDictionary = splitDictionary.map((item,index) => item.includes(value) && item.includes(className) ? index : null);
     const values = filteredDictionary.filter(item => item !== null).map(index => dictionary[index]);
    console.log(values);
  }
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-striped" id="my-table">
          <thead>
            <tr>
              <th>a1</th>
              <th>a2</th>
              <th>a3</th> 
              <th>a4</th>
              <th>a5</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td><label><input type="checkbox" name="selected" value="a" class="a1" />a</label></td>
              <td><label><input type="checkbox" name="selected" value="a" class="a2" />a</label></td>
              <td><label><input type="checkbox" name="selected" value="a" class="a3" />a</label></td>
              <td><label><input type="checkbox" name="selected" value="a" class="a4" />a</label></td>
             <td><label><input type="checkbox" name="selected" value="a" class="a5" />a</label></td>
              </tr>
            <tr>
              <td><label><input type="checkbox" name="selected" value="b" class="a1" />b</label></td>
              <td><label><input type="checkbox" name="selected" value="b" class="a2" />b</label></td>
              <td><label><input type="checkbox" name="selected" value="b" class="a3" />b</label></td>
              <td><label><input type="checkbox" name="selected" value="b" class="a4" />b</label></td>
             <td><label><input type="checkbox" name="selected" value="b" class="a5" />b</label></td>
              </tr>
            
                        <tr>
              <td><label><input type="checkbox" name="selected" value="c" class="a1" />c</label></td>
              <td><label><input type="checkbox" name="selected" value="c" class="a2" />c</label></td>
              <td><label><input type="checkbox" name="selected" value="c" class="a3" />c</label></td>
              <td><label><input type="checkbox" name="selected" value="c" class="a4" />c</label></td>
             <td><label><input type="checkbox" name="selected" value="c" class="a5" />c</label></td>
              </tr>
  </tbody>
</table>

＆＃13;

如何根据JavaScript中的部分字符串匹配过滤字符串对象？

1 个答案: