การเชื่อมโยงระดับที่สองสามารถมองเห็นได้ทุกที่ในหน้าเว็บทั่วไปโดยปกติจะมีที่อยู่เช่นคลิกที่จังหวัดเจ้อเจียงตามด้วยเมืองหางโจวและเมืองเจียบุคคล คลิกที่จังหวัดปักกิ่ง Chaoyang และ Haidian แทนที่จะเป็นหางโจวและเจียบุคคล
ในการใช้ขั้นตอนนี้คุณต้องใช้ JavaScript เพื่อนำไปใช้ หลักการใช้เวลา onchange
ก่อนอื่นเหตุการณ์ onchange เกิดขึ้นเมื่อเนื้อหาของโดเมนเปลี่ยนแปลง วัตถุ JavaScript ที่รองรับเหตุการณ์นี้: fileupload, SELECT, TEXT, TEXTAREA เราใช้ Select เพื่อดำเนินการตามการเชื่อมโยงรอง
ต่อไปนี้เป็นรหัส HTML ก่อนอื่นให้เลือกเลือกเป็นจังหวัดและเลือกที่สองเป็นเมือง แต่เราใช้อาร์เรย์ใน JS เพื่อเชื่อมต่อกับจังหวัด
การคัดลอกรหัสมีดังนี้:
<! doctype html>
<html>
<head>
<meta charset = "utf-8">
<title> JavaScript Secondary Linkage </title>
</head>
<body>
<เลือก id = "จังหวัด">
<ตัวเลือกค่า = "-1"> หัวเรื่อง </potion>
<ตัวเลือกค่า = "0"> ปักกิ่ง </portion>
<ตัวเลือกค่า = "1"> Zhejiang </potion>
</เลือก>
<เลือก id = "เมือง">
</เลือก>
<script src = "../ js/province.js"> </script>
</body>
</html>
ต่อไปนี้คือรหัส JS
การคัดลอกรหัสมีดังนี้:
var Province = document.getElementById ("จังหวัด");
var city = document.getElementById ("เมือง");
พื้นที่ var = [
['Chaoyang', 'Haidian', 'Beijing'], // อาร์เรย์ของพื้นที่ 0 0 {0,1,2}
['Hangzhou', 'Haining'] // อาร์เรย์ของพื้นที่แรก, 1 {0.1}
-
ฟังก์ชั่นเลือก () {
var opt = "";
var len = พื้นที่ [Province.Value]; // ถ้าเลือกปักกิ่ง 0 แล้ว len = ['chaoyang', 'haidian'] นี่คือ <span style = "พื้นหลังสี: #888888;"> เมือง </span> อาร์เรย์เชื่อมต่อจังหวัดที่สอดคล้องกับเมืองใด
if (province.value == '-1') {// เพราะเมื่อค่าของการเลือกคือ -1 มันเป็นคำว่า 'จังหวัด' ไม่ใช่ปักกิ่งดังนั้นเมื่อเราเลือกจังหวัดนี้หมายความว่าเมืองว่างเปล่า
city.innerhtml = opt;
-
สำหรับ (var i = 0; i <len.length; i ++) {// จำนวนอาร์เรย์ของพื้นที่สำหรับ (i = 0; i <3; i ++)
opt = opt + '<ค่าตัวเลือก = "' + i + '">' + len [i] + '</potion>' // opt = "" + <ตัวเลือกค่า = "0"> chaoyang (lin [0])
// opt = <ค่าตัวเลือก = "0"> chaoyang (lin [0]) </petion>, + <br>
<ตัวเลือกค่า = "1"> haidian (lin [1]) </opovie>
// opt = <ค่าตัวเลือก = "0"> chaoyang (lin [0]) </petion>, + <br>
<ตัวเลือกค่า = "1"> haidian (lin [1]) </potion> + <br>
<ตัวเลือกค่า = "2"> ปักกิ่ง (lin [2]) </potion>
-
city.innerhtml = opt;
-
Province.onchange = function () {
เลือก();
-
การเชื่อมโยงระดับที่สองสามารถมองเห็นได้ทุกที่ในหน้าเว็บทั่วไปโดยปกติจะมีที่อยู่เช่นคลิกที่จังหวัดเจ้อเจียงตามด้วยเมืองหางโจวและเมืองเจียบุคคล คลิกที่จังหวัดปักกิ่ง Chaoyang และ Haidian แทนที่จะเป็นหางโจวและเจียบุคคล
ในการใช้ขั้นตอนนี้คุณต้องใช้ JavaScript เพื่อนำไปใช้ หลักการใช้เวลา onchange
ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ฉันหวังว่าคุณจะชอบ