Question

我有一个简单的下拉菜单，如下所示：

<div id="actions" class="dropdown btn-group btn btn-outline-secondary" role="group">
  <div id="actionToggle" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    toggle
  </div>
  <div class="dropdown-menu" role="menu" aria-labelledby="actionToggle">
    <div class="dropdown-header">Actions ...</div>
    <a href="#" class="dropdown-item" name="action1">Action 1</a>
    <a href="#" class="dropdown-item" name="action2">Action 2</a>
    <a href="#" class="dropdown-item" name="action3">Action 3</a>
  </div>
</div>

如docs所述，可以使用JavaScript打开下拉菜单。例如。在Jquerys onDomready中使用dropdown("toggle")方法将在加载页面时打开菜单。以下代码按预期打开菜单：

$("#actionToggle").dropdown("toggle");

但是当我尝试在Jquery onclick-event处理程序中使用代码时，它不会打开菜单。它是相同的代码，并且事件被正确触发。任何想法在这里出了什么问题？

$("#open").on("click", function() {
  $("#actionToggle").dropdown("toggle");
});

我要点击的html元素如下所示：

<div id="open">text</div>

点击文字应该会打开菜单，但它不会......

我准备了一个JSFiddle来玩代码：https://jsfiddle.net/3ot08j68/1/

使用以下库：JQuery 3.2.1，Bootstrap 4.0beta.3，Popper 1.12.9

Answer 1

更改您的代码

echo ${grr}"Script finished with following results"${txtrst}
for i in "${INFO[@]}"
do
    #echo $i
    if [[ $i == *"0"* ]]; then
        codename=${i//0}
        echo "${red}Compilation error for device" $codename${txtrst}
    elif [[ $i == *"1"* ]]; then
        codename=${i//1}
        echo "${ylw}Warning for device" $codename${txtrst}
    else
        codename=${i//2}
        echo "${grn}Device" $codename "compiled and uploaded successfully :)${txtrst}"
    fi

到

$("#open").on("click", function() {
  $("#actionToggle").dropdown("toggle");
});

它会起作用。我已更新了您的fiddle。

Bootstrap 4：使用javascript打开下拉菜单

1 个答案: