Question

我在JSON数组中有两个项目如图所示

[
    {
        "name": "Item  1",
        "value": [
            "None",
            "Honey with Butter"
        ]
    },
    {
        "name": "Item  2",
        "value": [
            "None",
            "None"
        ]
    }
]

（无表示该项目没有选择Topping）

如果项目没有任何Toppings，我必须隐藏该项目的 Toppings 标题

这是我的jsfiddle

http://jsfiddle.net/ksmzzaeo/

我试过这种方式

var toppingstyle = "none";
var divhtmltoppings = '';


for (var l = 0; l < toppings.length; l++) {
  var toppingsul = '<ul>';
       $.each(toppings[l].value, function (i, text) {
                if (text != '' && text != undefined&&text!='None') {
                    toppingsul += "<li>" + text + "</li>";
                }
            });
    var item =  l + 1;
    if(toppingsul!='<ul>')
    {
        toppingstyle = 'block';
    }
   divhtmltoppings+='<h5>Item '+item+'</h5><h6 style="display:'+toppingstyle+'">Toppings</h6> '+toppingsul;
  }
  $('.crust-topping-detailsWrap').append(divhtmltoppings);

请问我能告诉我如何实现这个目标吗？

这是我的jsfiddle

http://jsfiddle.net/ksmzzaeo/

Answer 1

你这里有一些奇怪的检查

  if (toppingsul != '<ul>') {
        toppingstyle = 'block';
    }

请参阅更新的小提琴：http://jsfiddle.net/ksmzzaeo/1/

Answer 2

如果有浇头，您可以看到标题，但如果没有浇头，则不会使其隐藏，因此一旦标题可见，其余部分都将变为可见。

没有浇头时设置none样式：

if(toppingsul!='<ul>')
{
    toppingstyle = 'block';
} else {
    toppingstyle = 'none';
}

演示：http://jsfiddle.net/Guffa/ksmzzaeo/4/

注意：您没有</ul>与<ul>匹配，因此这些项目将互相嵌套。添加一个就是这样的：

http://jsfiddle.net/Guffa/ksmzzaeo/5/

无法隐藏子标题

2 个答案: