ตัวอย่างบทความนี้อธิบายวิธีการรับข้อมูลโหนดที่เลือกทั้งหมดโดย JS Tree Plug-in Ztree แบ่งปันสำหรับการอ้างอิงของคุณ การวิเคราะห์เฉพาะมีดังนี้:
เพราะฉันยังใหม่กับต้นไม้ของสิ่งต่าง ๆ ฉันเห็น ztree ออนไลน์เขียนโดยภาษาจีน ดังนั้น API จะต้องเป็นภาษาจีน และความคิดเห็นก็ดีเช่นกัน ดังนั้นลองใช้ ztree ในโครงการ นี่เป็นเรื่องง่ายที่จะได้รับข้อมูลโหนดที่เลือกทั้งหมด เพียงแค่ดู API เพื่อทำความเข้าใจ ดังนั้นฉันจึงอัปโหลดรหัส
คัดลอกรหัสดังต่อไปนี้: <! doctype html>
<html>
<head>
<title> ztree demo - ข้อมูลมาตรฐาน </title>
<meta http-equiv = "content-type" content = "text/html; charset = utf-8">
<link rel = "stylesheet" href = "css/ztreestyle/ztreestyle.css" type = "text/css">>
<link rel = "stylesheet" href = "css/demo.css" type = "text/css">
<script type = "text/javascript" src = "js/jQuery-1.4.4.min.js"> </script>
<script type = "text/javascript" src = "js/jQuery.ztree.core-3.4.js"> </script>
<script type = "text/javascript" src = "js/jQuery.ztree.excheck-3.4.js"> </script>
-
<script type = "text/javascript" src = "js/jQuery.ztree.exedit-3.4.js"> </script>->
<script type = "text/javascript">
-
การตั้งค่า var = {
ตรวจสอบ:{
เปิดใช้งาน: จริง
-
/*ข้อมูล: {
Simpledata: {
เปิดใช้งาน: จริง
-
-
ข้อมูล: {
Simpledata: {
เปิดใช้งาน: จริง
-
-
โทรกลับ: {
onCheck: onCheck
-
-
var znodes = [
{id: 1, pid: 0, ชื่อ: "ตรวจสอบ 1 at will", เปิด: false},
{id: 11, pid: 1, ชื่อ: "ตรวจสอบ 1-1 at will", open: true},
{id: 111, pid: 11, ชื่อ: "ตรวจสอบ 1-1-1"},
{id: 112, PID: 11, ชื่อ: "ตรวจสอบ 1-1-2 ที่ Will"},
{id: 12, pid: 1, ชื่อ: "ตรวจสอบ 1-2 at will", เปิด: true},
{id: 121, PID: 12, ชื่อ: "ตรวจสอบ 1-2-1 ที่ Will"}
{id: 122, pid: 12, ชื่อ: "ตรวจสอบ 1-2-2 at will"},
{id: 2, pid: 0, ชื่อ: "ตรวจสอบ 2 at will", เปิด: false},
{id: 21, PID: 2, ชื่อ: "ตรวจสอบ 2-1 ที่ Will"},
{id: 22, pid: 2, ชื่อ: "ตรวจสอบ 2-2 at will", เปิด: true},
{id: 221, PID: 22, ชื่อ: "ตรวจสอบ 2-2-1 ที่ Will"},
{id: 222, PID: 22, ชื่อ: "ตรวจสอบ 2-2-2"},
{id: 23, pid: 2, ชื่อ: "ตรวจสอบ 2-13 at will"}
-
$ (เอกสาร) .ready (function () {
$ .fn.ztree.init ($ ("#treedemo"), การตั้งค่า, znodes);
-
ฟังก์ชั่น oncheck (e, treeid, treenode) {
var treeobj = $. fn.ztree.getztreeobj ("treedemo")
โหนด = treeobj.getCheckedNodes (จริง)
v = "";
สำหรับ (var i = 0; i <nodes.length; i ++) {
v + = โหนด [i] .name + ",";
การแจ้งเตือน (โหนด [i] .id); // รับค่าของโหนดที่เลือก
-
-
-
</script>
</head>
<body>
<div>
<ul id = "treedemo"> </ul>
</div>
</body>
</html>
ฉันหวังว่าบทความนี้จะเป็นประโยชน์กับการเขียนโปรแกรม JavaScript ของทุกคน