Chosen 플러그인

2680 단어
$("#teams").trigger("liszt:updated");//업데이트 다시 바인딩$("#teams").chosen()
Chosen 옵션 목록 주소:https://github.com/amazeui/chosen/blob/master/docs/options.md
demo.html
Chosen 옵션 목록
매개변수를 통한 전송 옵션
다음 매개 변수는 실례화할 때 매개 변수를 통해 설정합니다.
$('.my_select_box').chosen({
  disable_search_threshold: 10,
  no_results_text: 'Oops, nothing found!',
  width: '95%'
});

옵션
기본값
묘사
allow_single_deselect
false true로 설정하면 비필수 라디오 상자에 선택 지우기 아이콘 이 표시됩니다.
disable_search
false
선택 상자의 검색 상자를 숨기도록 설정truedisable_search_threshold
0 n 미만일 경우 검색 상자 숨기기
enable_split_word_search
true
분사 검색을 켤지 여부, 기본적으로 켤지 여부
inherit_select_classes
false
select 요소의class를 계승할 지 여부입니다. true 로 설정하면 Chosen은 select의class를 용기에 추가합니다.
max_selected_options
Infinity
최대 선택 항목 수, 최대 한계에 도달하면 이벤트 트리거chosen:maxselectedno_results_text
"No results match"
일치하는 항목을 검색할 때 표시할 텍스트가 없습니다
placeholder_text_multiple
"Select Some Options"
다중 선택 상자에 선택 항목이 없을 때 표시되는 자리 차지 문자
placeholder_text_single
"Select an Option"
선택 상자에 선택 항목이 없을 때 표시되는 자리 차지 문자
search_contains
false
검색 포함 항목, 기본적으로 첫 번째 문자부터 일치
single_backstroke_delete
true
다중 선택 상자에서 체크아웃 키를 사용하여 선택한 항목을 삭제합니다. false 로 설정하면, 처음 delete/백스페이스를 누르면 가장 좋은 선택 항목이 강조되고, 누르면 삭제됩니다.
width
Original select width.
Chosen에서 생성한 선택 상자 너비, 기본값은 원래 select 너비와 일치합니다
display_disabled_options
true
선택 불가 항목 표시 여부
display_selected_options
true
다중 선택 상자에서 선택한 항목을 아래 목록에 표시할지 여부
등록 정보
에서
등록 정보
묘사
data-placeholder
자리 표시자 텍스트 참고: 속성 변경은 또는 placeholder_text_multiple 옵션을 덮어씁니다.
multiple
이 속성이 있는 select는 여러 선택 가능한 Chosen 선택 상자로 렌더링됩니다.
selected, disabled
Chosen이 이러한 속성을 읽도록 선택, 해제 상태를 설정합니다.
이벤트 트리거
Chosen은 소스placeholder_text_single 요소에서 특정 이벤트를 트리거하여 Chosen의 스니퍼 함수를 호출합니다.
// tell Chosen that a select has changed
$('.my_select_box').trigger('chosen:updated');

이벤트
묘사
chosen:updated
JS를 통해 select 요소 옵션을 변경할 때 이 이벤트를 터치해서 Chosen에서 생성한 선택 상자를 업데이트해야 합니다
chosen:activate
HTML 포커스 이벤트
chosen:open
Chosen 활성화 및 검색 결과 표시
chosen:close
Chosen을 닫고 검색 결과를 숨깁니다.

좋은 웹페이지 즐겨찾기