Question

阅读一些发布的内容并使用w3schools.com作为参考。这是我所拥有的，我在javascript中动态创建html代码并调用html id并通过.innerHTML属性插入动态代码。我有正确的链接和脚本引用（在我的HTML中）。

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

我的JavaScript（.js文件）

var htmlHeader = '<div class="dropdown">' +
    '<th class="header">Notifies Details</th>' +
    '<th class="header" style="font-weight:bold; font-size:18px; text-align:right;">' +
        '<a href="javascript:triggerDropDown()"><span class="glyphicon glyphicon-filter dropdown-toggle" data-toggle="dropdown"></span></a>' +
        '<a href="javascript:hideDivById(&quot;notifiesDetailsDiv&quot;)">&times;</a></th>' + 
    '<ul class="dropdown-menu">' +
        '<li><a href="#">Due Date</a></li>' +
        '<li><a href="#">RSU</a></li>' +
    '</ul>' +
    '</div>';


document.getElementById("notifyDetailstheadId").innerHTML = htmlHeader;
document.getElementById("notifyDetailstbodyId").innerHTML = htmlTable;

最终，这是在左侧带有标题（通知详细信息）的表格的标题中，过滤器图标和右侧的“X”。单击过滤器图标时，我希望显示菜单。

我还尝试添加此JavaScript以使其触发无效

    console.log("triggerDropDown() ran");
$(document).ready(function() {
    $(".dropdown-toggle").dropdown();
});

Bootstrap Dropdown无法使用动态html

0 个答案: