Latest web development tutorials

플러그인 개요 부트 스트랩

이전 섹션에서 그것은 시작에 불과 어셈블리에구성 요소의 레이아웃을 논의했다.12가지 jQuery 플러그인은 기능이 더 인터랙티브 사이트에 추가 할 수있는 확장으로 부트 스트랩이 제공됩니다. 당신이 고급 자바 스크립트 개발자가 아닌 경우에도, 당신은 또한 부트 스트랩 자바 스크립트 플러그인을 배우고 시작할 수 있습니다. 사용 부트 스트랩 데이터 API (부트 스트랩 데이터 API)는 플러그의 대부분은 코드를 작성하지 않고 트리거 될 수있다.

사이트는 두 가지 방법으로 부트 스트랩 플러그 참고 :

  • 혼자 견적 : 부트 스트랩의 별도*의 .js파일을 사용합니다.일부 플러그인 및 CSS 구성 요소는 다른 플러그인에 따라 달라집니다. 별도의 기준을 연결 경우, 플러그인 사이의 종속성을 알고 있어야합니다.
  • 사용bootstrap.js또는bootstrap.min.js의압축 된 버전: (동시에) 견적을컴파일합니다.
    bootstrap.js의bootstrap.min.js 모든 플러그인이 포함되어 있기 때문에이 두 파일을 인용하려고하지 마십시오.
모든 플러그인은 jQuery를에 의존한다. 당신은 jQuery를하기 전에 플러그인 파일에서 참조해야합니다. 방문 bower.json 부트 스트랩을 jQuery를의 현재 지원되는 버전을 볼 수 있습니다.

속성 데이터

  • 당신은 자바 스크립트 코드의 한 라인을 작성하지 않고 모든 데이터가, 부트 스트랩 플러그인 API 속성 사용할 수 있습니다. 이것은 최고 수준의 부트 스트랩 API, 그것은 당신의 선호하는 방법이어야한다.
  • 그럼 다시, 어떤 경우에는이 기능을 해제해야 할 수 있습니다. 따라서, 우리는 또한 즉 데이터 API를 네임스페이스를 들어 올려 문서 이벤트에 바인딩하는 폐쇄 된 데이터 속성 API 방법을 제공합니다. 다음과 같은 :
    $ (문서) .OFF ( '. 데이터-API')
    
  • 다음과 같이, 단지 데이터 API를 네임 스페이스 플러스 네임 스페이스와 같은 위젯의 이름 앞에 특정 플러그인을 닫으려면
    $ (문서) .OFF ( '. Alert.data-API')
    

프로그래밍 API

우리는 부트 스트랩 플러그인에 대한 순수 자바 스크립트 API에 대한 방법을 제공합니다. 모든 공용 API 호출 (: 양식 및 jQuery를 계약을 호출 주) 개별적으로 지원 또는 모드를 연결하고, 작동 요소의 집합을 반환한다. 예를 들면 :

$ ( ". Btn.danger"). 버튼 ( "토글"). AddClass ( "지방")

다음, 선택 옵션이 취할 수있는 모든 방법 파라미터로 객체 또는 문자열은 특정 방법을 나타내는 없거나 매개 변수 (이 경우, 기본 동작을위한 플러그인을 초기화한다)

// $ ( "# myModal")의 기본 동작을 초기화. 모달 ()    
 //은 $ ( "#의 myModal") 모달를 지원하지 않는 키보드를 초기화 ({키보드 : 거짓}).  
// 초기화하고 즉시 쇼를 호출
$ ( "# MyModal"). 모달 ( '쇼')                

$ .fn.popover.Constructor:각 플러그인의constructor 속성에 또한 원래의생성자를 노출합니다.특정 위젯의 인스턴스를 얻고 싶은 경우에 당신은 페이지 요소를 통해 직접 얻을 수 있습니다 :

 $ ( '[REL = 팝 오버]'). 데이터 ( '팝 오버').

네임 스페이스 충돌을 피하기

때때로 부트 스트랩 플러그인은 다른 UI 프레임 워크와 함께 사용 할 필요가 있습니다. 이 경우에는, 네임 충돌이 발생할 수있다. 이 경우 불행하게도, 당신은 위젯.noConflict 메소드를 호출하여 원래 값을 복원 할 수 있습니다.

//) (할당 된 값 var에 bootstrapButton = $ .fn.button.noConflict 전에 $ .fn.button를 돌려줍니다 
//은 $ 들어 (). BootstrapBtn 기능은 부트 스트랩 수여					       
$ .fn.bootstrapBtn = BootstrapButton            

행사

부트 스트랩은 대부분의 플러그인의 고유 한 동작으로 사용자 정의 이벤트를 제공합니다. 일반적으로 이러한 이벤트는 두 가지 형태로 제공 :

  • 부정사 : 이벤트가 시작되면이 발생됩니다.쇼 :이러한예로서.부정사이벤트는로 preventDefault 기능을 제공합니다.이는 이벤트가 시작하기 전에 가능한 동작을 정지 할 수있다.
    $ ( '#의 MyModal').에서 ( 'show.bs.modal', 기능 (전자) {
    // 방지 모달 상자가 표시됩니다 경우 (! 데이터) (e.preventDefault 반환) 
    })
    
  • 과거 분사 형태 : 작업이 완료된 후이 발생됩니다.같은예 : 도시.