부트 스트랩 4 : 자바 스크립트

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에 설명 된대로를,이 드롭 다운 메뉴를 열고 자바 스크립트를 사용 가능합니다. 예 : Jquerys onDomready에서 dropdown("toggle") 메서드를 사용하면 페이지가로드 될 때 메뉴가 열립니다.

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

을하지만 JQuery와 온 클릭 이벤트 핸들러 내부의 코드를 사용하려고 할 때,이 메뉴를 열 수 없습니다 : 다음 코드는 예상대로 메뉴가 열립니다. 그것은 동일한 코드이고 이벤트는 올바르게 시작됩니다. 어떤 아이디어가 잘못 되었습니까?

가 나는 준비 ...

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

메뉴를 열어야합니다 텍스트을 클릭하면,하지만하지 않습니다

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

내가 클릭 할 HTML 요소는 다음과 같습니다 JSFiddle with the code : https://jsfiddle.net/3ot08j68/1/

다음 라이브러리가 사용되었습니다. JQuery 3.2.1, Bootstrap 4.0beta.3, Popper 1.1

Answer 1

2.9

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

에 코드

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

을 변경

그것은 작동합니다. fiddle을 업데이트했습니다.