jquery를 기반으로 중국 대학을 선택하는 팝업 상자(데이터, 단계, 코드)_jquery

1.
데이터는 전국 총 3049개 대학을 포함하고 있습니다. Renren에서 복사한 것입니다. (학습 및 교환용으로만 사용하십시오. 상업적인 프로젝트에는 사용하지 마십시오.) 에 포함된 JSON 개체입니다. 학교 정보를 저장합니다. 형식은

코드 복사 코드는 다음과 같습니다.

var schoolList=[
{
"id":1, //지방 ID
"school": [
{
"id": 1001, //학교 ID
"name": "u6e05u534eu5927u5b66" // 학교 이름
}
/....
], //이 지역의 학교
"name": "u5317u4eac"
},
//...
]

2. 단계
2.1 팝업 프레임의 구조 및 팝업 방식
현재 팝업 프레임은 iframe과 div의 두 가지 형태로 나뉩니다. 이 예에서는 팝업 프레임으로 div를 사용하기로 선택했으며 팝업 프레임의 구조는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

="choose-box">

학교 선택

;div id="choose-a-province">

;div id="choose-box-bottom">

사용자 경험을 위해 팝업 상자는 처음에는 숨겨집니다(display:none). 팝업 상자를 열면 팝업 상자가 페이지 중앙에 표시되어야 합니다. 중앙 정렬 효과를 얻으려면 다음 코드를 사용하세요.