Javascript 引导子菜单JSON

我试图创建一个从JSON加载的引导子菜单。但是，仅显示第一个列表，而不是两个列表

以下是HTML：

<section class="btn-group">
<button type="button" class="btn btn-default">Line Item</button>
<button class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="#">
<span class="caret"></span>
<span class="sr-only">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu" id="dropdownMenu">
</ul>
</section>

行项目
切换下拉列表

以下是JSON：

<script type="text/javascript">
$('.dropdown-submenu > a').submenupicker();

var jsonList = {"List" : [
    {"liName" : "Income"},
    {"liName" : "Cash Flow"},
    {"liName" : "Balance Sheet"},
    {"liName" : "Per Share", "liName2" : "CFPS"}
]}

$(document).ready(function(){
    var listItems = "";
    for (var i = 0; i < jsonList.List.length; i++) {
        listItems += "<li class='dropdown-submenu'><a tabindex='-1' href='#'>" + jsonList.List[i].liName + "</a><ul class='dropdown-menu'><li><a href='#'>" + jsonList.List[i].liName2 + "</a></li></ul></li>";
    }

    $("#dropdownMenu").append(listItems);
    $("#dropdownMenu").html();
});

$（'.dropdown子菜单>a'）.SubNumPicker（）；
var jsonList={“列表”：[
{“liName”：“收入”}，
{“liName”：“现金流”}，
{“liName”：“资产负债表”}，
{“liName”：“每股”，“liName2”：“CFPS”}
]}
$（文档）.ready（函数（）{
var listItems=“”；
for（var i=0；i
”；
}
$（“#下拉菜单”）.append（列表项）；
$（“#下拉菜单”）.html（）；
});

[解决方案]

首先创建列表

之后，调用subnumpicker（）函数

这是我的密码。：）

1。HTML

<section class="btn-group">
        <button type="button" class="btn btn-default">Line Item</button>
        <button class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            <span class="caret"></span>
            <span class="sr-only">Toggle Dropdown</span>
        </button>

        <ul class="dropdown-menu" role="menu" id="dropdownMenu"></ul>
    </section>

行项目
切换下拉列表

2。Javascript

<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-submenu.min.js"></script>
<script type="text/javascript">
        var jsonList = {"List" : [
                                {"liName" : "Income"},
                                {"liName" : "Cash Flow"},
                                {"liName" : "Balance Sheet"},
                                {"liName" : "Per Share", "liName2" : "CFPS"}
                            ]};

        $(document).ready(function() {
            var list_item_html = "";
            var submenu_html = "";

            var main_item = "";
            var submenu_item = "";

            for (var i = 0; i < jsonList.List.length; i++) {
                main_item = jsonList.List[i].liName;
                submenu_item = jsonList.List[i].liName2;

                submenu_html = "";

                if(main_item != null && submenu_item != null) {
                    submenu_html = "<li class='dropdown-submenu'>"
                                    + "<a tabindex='0' data-toggle='dropdown'>" + main_item + "</a>"
                                    + "<ul class='dropdown-menu'>" 
                                        + "<li><a href='#' tabindex='0'>" + submenu_item + "</a></li>" 
                                    + "</ul>"
                                   +"</li>";
                    list_item_html += submenu_html;
                } else {
                    list_item_html += "<li><a href='#'>" + main_item + "</a></li>";
                }
            }

            $("#dropdownMenu").html(list_item_html);      // 1. Create List
            $('.dropdown-submenu > a').submenupicker();   // 2. After, call submenupicker function.
        });

    </script>

var jsonList={“列表”：[
{“liName”：“收入”}，
{“liName”：“现金流”}，
{“liName”：“资产负债表”}，
{“liName”：“每股”，“liName2”：“CFPS”}
]};
$（文档）.ready（函数（）{
var list_item_html=“”；
var子菜单_html=“”；
var main_item=“”；
var子菜单_item=“”；
for（var i=0；i”
+“”
+“”
+“”；
列表项html+=子菜单html；
}否则{
列出项目html+=“
”；
}
}
$（“#下拉菜单”）.html（列表项html）；//1.创建列表
$（'.dropdown submenu>a'）.submenucker（）；//2.之后，调用submenucker函数。
});

选择标签中是否应包含

？