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数组的循环，然后在循环内部进行比较以查看该标记是否与您的make_aware匹配。此外，您在key内动态构建的html是无效的HTML（您有开放元素）。

$('--html here--')

(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)

Ohhhhh！通过再次阅读您的问题，似乎<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="container"> </div>是一个字符串而不是一个数组。如果是这种情况，请参阅下文。

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)

Answer 2

尝试（tags.includes（key））而不是（key === tags）。您正在检查字符串是否包含在较大的字符串中，而不是“tag1 tag2 tag3”是否完全等于“tag1”。

有条件地从解析的JSON中追加与值匹配的元素

2 个答案: