เมนูที่เกี่ยวข้องกับจังหวัดและเทศบาลขนาดเล็กใช้เวลาสำรวจมาก เหตุผลก็คือมันไม่ได้มีทักษะใน jQuery เนื่องจากมันทำงานอย่างหนักเพื่อให้ส่วนประกอบเสร็จสมบูรณ์จึงต้องการแบ่งปันสำหรับผู้ที่ต้องการใช้งาน
นี่เป็นเพียงรุ่นพื้นฐานและจำเป็นต้องได้รับการปรับให้เหมาะสมในภายหลัง
รหัส: การดาวน์โหลดเมนูที่เกี่ยวข้องกับจังหวัดและเทศบาลที่อยู่
ภาพประกอบ:
ฉันจะไม่พูดถึงคำสั่ง SQL อีกต่อไปมันมีไฟล์สองไฟล์“ city.sql” และ“ provincial.sql”
1. พูดคุยเกี่ยวกับการรับข้อมูลก่อน
โมฆะสาธารณะ initProcitys () {logger.info ("รับภูมิภาค"); รายการ <brovincials> จังหวัด = Provinces.me.getProvincials (); สำหรับ (จังหวัดจังหวัด: จังหวัด) {รายการ <เมือง> เมือง = Citys.me.getCitySbyProvincialId (Provincial.getLong ("ID")); Provincial.put ("Citys", Jsonkit.tojson (เมือง)); } setattr ("จังหวัด", จังหวัด); render ("procity.jsp");}1). รับเมนูจังหวัดทั้งหมดก่อน
2). รับเมนูเทศบาลที่สอดคล้องกันตามรหัสประจำจังหวัด
3). เมื่อได้รับเมนูเทศบาลโปรดทราบว่ารายการจะถูกแปลงเป็นข้อมูล JSON และใช้ Jackjson ที่นี่
2. พูดถึงเค้าโครงหน้า
<select name = "Province_Code" id = "Province_select"> <c: foreach items = "$ {Provincials}" var = "item"> <opption value = "$ {item.procode}" cdata = '$ {item.citys}'> $ {item.proname} id = "city_select"> </select>1). มีการใช้สองตัวเลือกและยังไม่มีการเพิ่มสไตล์
2). ใช้ foreach เพื่อเริ่มต้นเมนูจังหวัดก่อนและในเวลาเดียวกันผูกข้อมูลเมืองกับแอตทริบิวต์ CDATA
3. บอกฉันเกี่ยวกับการใช้งาน JS
$ (function () {ProvincialChange (); var $ provincial = $ ("#province_select"); $ provincial.change (ProvincialChange);}); ฟังก์ชั่น ProvincialChange () {var $ provincial = $ ("#province_select"); // ค่ารหัสที่แสดงในระดับจังหวัด var provincial_code = $ provincial.val (); var $ selectedOption = $ ('#province_select ตัวเลือก [value =' + provincial_code + ']'); var city_data = yunm.jsoneval ($ selectedoption.attr ("cdata")); // รายการเมนูเทศบาล $ city_select = $ ("#city_select"); $ city_select.empty (); สำหรับ (var i = 0; i <city_data.length; i ++) {var code = city_data [i] .code; var cname = city_data [i] .cname; $ city_select.append ("<ตัวเลือกค่า = '"+รหัส+"'>"+cname+"</optup>"); -1). เมื่อการเริ่มต้นการเริ่มต้นการโหลดและการสลับเมนูประจำจังหวัดเมนูเทศบาลจะต้องโหลด
2). ก่อนอื่นรับเมนูจังหวัดรับค่าปัจจุบันจากนั้นรับตัวเลือกตามค่า
3). รับข้อมูลเทศบาลจากตัวเลือกและให้ความสนใจกับการใช้ Eval เพื่อแปลงข้อมูล เหตุผลเฉพาะอาจเป็นได้ว่าส่วนใหญ่จะเพิ่ม ()
4. ) วนผ่านเมนูเทศบาลและการแสดงผล
หากคุณยังต้องการศึกษาในเชิงลึกคุณสามารถคลิกที่นี่เพื่อศึกษาและแนบ 3 หัวข้อที่น่าตื่นเต้นให้คุณ:
การสอนการเรียนรู้ bootstrap
การสอนการใช้งาน Bootstrap
การสอนการใช้งานปลั๊กอิน bootstrap
ข้างต้นเป็นเรื่องเกี่ยวกับบทความนี้และฉันหวังว่ามันจะเป็นประโยชน์สำหรับทุกคนในการเรียนรู้การเขียนโปรแกรม bootstrap