有条件地附加匹配值的已解析JSON中的元素

Question

我正在根据标签数据是否与关键变量匹配，有条件地将元素附加到容器。

返回标签数据的方式就像tag1 tag2 tag3 tag4 tag5，关键是匹配一些标签数据，但它仍然没有执行附加条件。

任何形式的这种头痛的帮助将不胜感激！

下面的代码：

var key = getParameterByName('img'); 

var tags = item.tags; 

     if (key != null){ 
      //move onto conditional append 

      if (key === tags) { 

     $('<div class="photo"> 
      <figure class="cell" data="'+tags+'"> 
      <figcaption class="caption" style="display: none;"> '+title+' <a href="">click</a></figcaption> 
      <a href="' +imgb+ '"><img src="' +img+ '" class="small-image"/></a></figure>').appendTo('#container'); 
      } 
     } 
     else { 
     $('<div class="photo"><figure class="cell" data="'+tags+'"><figcaption class="caption" style="display: none;">'+title+'<a href="">click</a></figcaption><a href="'+imgb+'"><img src="'+img+'" class="small-image"/></a></figure>').appendTo('#container'); 
     } 

Answer 1

尝试（tags.includes（密钥）），而不是（关键===标签）。您正在检查一个字符串是否包含在较大的字符串中，而不是“tag1 tag2 tag3”与“tag1”完全相同。

Answer 2

你缺少环路直通的标签阵列，然后在循环内部比较，看是否标签匹配您的key。此外，在$('--html here--')内部动态构建的HTML不是有效的HTML（您有打开的元素）。

(function($){$(function(){ 
 
    var key = 'tag2'; 
 
    var tags = ['tag1', 'tag2', 'tag3']; 
 

 
    if (key != null){ 
 
    //move onto conditional append 
 
    tags.map(function(tag, k){ 
 
     if (key === tag) { 
 
     $('<div class="photo">The tag value is ' + tag + '</div>').appendTo('#container'); 
 
     } 
 
    }); 
 
    } 
 
    else { 
 
    $('<div class="photo">The tag key is null</div>').appendTo('#container'); 
 
    } 
 

 
})})(jQuery)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="container"> 
 
</div>

Ohhhhh！通过再次阅读您的问题似乎tags是一个字符串不是数组。如果是这种情况，请参阅下文。

(function($){$(function(){ 
 
    var key = 'tag3'; 
 
    var tags = 'tag1 tag2 tag3'; 
 

 
    if (key != null){ 
 
    //move onto conditional append 
 
    if (tags.includes(key)) { 
 
     $('<div class="photo">The tag value is ' + key + '</div>').appendTo('#container'); 
 
    } 
 
    else { 
 
     $('<div class="photo">The tag value is ' + key + ' but is not in the list of tags</div>').appendTo('#container'); 
 
    } 
 
    } 
 
    else { 
 
    $('<div class="photo">The tag key is null</div>').appendTo('#container'); 
 
    } 
 

 
})})(jQuery)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="container"> 
 
</div>