Das beste jQuery EasyUI Baum Menü - Baum-Menü einen Knoten hinzufügen-Tutorial im Jahr 2024. In diesem Tutorial können Sie Download von jQuery EasyUI Beispiele, lernen
Dieses Tutorial zeigt Ihnen, wie Sie einen Knoten zum Baum Menü (Baum) zu befestigen. Wir werden ein Lebensmittel Baumknoten erstellen, die Obst und Gemüse enthält, und dann an die bestehende Fruchtknoten eine andere Frucht hinzuzufügen.
Erstens haben wir Lebensmittel Baum zu erstellen, wird der Code wie folgt:
<Div style = "width: 200px; height: auto; border: 1px solid #ccc;"> <Ul id = "tt" class = "easyui-tree" url = "tree_data.json"> </ ul> </ Div>
Bitte beachten Sie, dass der Baum (Baum) Komponente in der <ul> -Tag definiert ist, Baumknoten Daten von URL "tree_data.json" geladen.
Dann Fruchtknoten wir, indem Sie auf den Knoten wählen, werden wir einige andere Früchte Daten hinzufügen. Executive-GetSelected erhalten Verarbeitungsknoten:
var node = $ ( '# tt') Baum ( 'GetSelected') .;
Zurück Ergebnis GetSelected Methode ein JavaScript-Objekt, das eine ID, einen Text hat, Zieleigenschaft. Zieleigenschaft ist ein DOM-Objekt Referenzknoten ausgewählt, wird seine Methode append für zusätzliche Kindknoten verwendet werden.
var node = $ ( '# tt') Baum ( 'GetSelected') .; if (Knoten) { var nodes = [{ "Id": 13, "Text": "Himbeere" }, { "Id": 14, "Text": "Cantaloupe" }]; $ ( '# Tt'). Baum ( 'append', { parent: node.target, Daten: Knoten }); }
Wenn Sie etwas Obst hinzufügen, werden Sie sehen:
Wie Sie sehen können, mit easyui Baum (Baum) Plug-in zu einem zusätzlichen Knoten ist nicht so schwierig.