링크를 클릭한 후에도 내 Bootstrap 3 축소 메뉴가 계속 열려 있는 이유는 무엇입니까?

Bootstrap 3: 지속되는 축소된 메뉴 문제 해결

문제:

Bootstrap 3 탐색에서 축소된 메뉴 메뉴 링크를 클릭한 후에도 계속 열려 있어 사용자 경험을 방해합니다.

답변:

이 문제를 해결하려면 다음 코드를 구현하십시오.

$(document).on('click','.navbar-collapse.in',function(e) {
    if( $(e.target).is('a') ) {
        $(this).collapse('hide');
    }
});

세부 정보:

• 이 솔루션은 이벤트 리스너를 문서에 바인딩하여 확장된 탐색 메뉴(클래스: ".navbar-collapse.in") 내의 클릭을 모니터링합니다.
• 메뉴 링크("a" 요소)를 클릭하면 $(this).collapse('hide'); 탐색 메뉴 축소를 트리거합니다.

업데이트 [2014-11-04]:

• 하위 메뉴가 있는 탐색의 경우 코드를 다음으로 수정하세요. :

$(document).on('click','.navbar-collapse.in',function(e) {
    if( $(e.target).is('a:not(".dropdown-toggle")') ) {
        $(this).collapse('hide');
    }
});

• 이 수정을 통해 드롭다운 토글이 아닌 메뉴 링크만 메뉴 축소를 트리거합니다.

위 내용은 링크를 클릭한 후에도 내 Bootstrap 3 축소 메뉴가 계속 열려 있는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!