使用event.stopPropagation切换下拉菜单在第一次尝试时不会打开下拉菜单

Question

由于要描述here的问题，我必须使用event.stopPropagation（）来覆盖下拉菜单的onclick方法。我想在保存按钮旁边有一个下拉列表，就像Reddit一样：

我的HTML结构如下：

<div class="dropdown">
    <a class="link-hover" data-toggle="dropdown" id="post{{post.pk}}" onclick="dropdown(event, this.id);">
        <i class="fa fa-chevron-down dark-icon" aria-hidden="true"></i>
    </a>
    <div class="dropdown-menu my-drop-menu">
        <a class="dropdown-item my-drop-menu-item" href="{% url 'post-update' post.pk %}">Edit</a>
        <!-- ... more a tags -->
    </div>
</div>

我最终得到的JS函数是：

function dropdown(event, postId) {
    event.stopPropagation();
    $('#' + postId).dropdown();
}

但是问题在于下拉菜单在第一次尝试时无法打开。仅在第二次单击和后续单击时。

我该如何解决？

编辑：

另一方面，当我.dropdown(); .dropdown('toggle');时，它仅在第一次尝试时打开。在浏览器检查器中，这些类不会在第二次尝试时添加。