如何檢測節點何時離開組？ JqTree
[英]How can I detect when a node left a group? JqTree
問題描述
我已經有了這棵樹，並讓它每次將節點移到另一個節點時都發送一個child的id及parent's節點的id ，但是我還想檢測何時將孩子移到其父節點之外。
在螢火蟲上檢查
澄清：
例如，我有兩個節點：
node1（無父）
node2（無父）
然后，我將node1移到node2 ：
（然后我使用以下方法檢查位置： if (event.move_info.position == 'inside'); ）
node2（無父）
節點（node2）
我還要檢查何時將node1移到node2之外：
但是沒有 event.move_info.position == 'outside'
從：
node2（無父）
節點（node2）
至：
node1（無父）
node2（無父）
你能啟發我嗎？
提前致謝。
$(document).ready(function() { //Mandar o response aqui no data var data = [{ label: 'node1', id: 1, children: [{ label: 'child1', id: 2 }, { label: 'child3', id: 3 }, { label: 'child2', id: 4 }, { label: 'child2', id: 5 }] }, { label: 'node2', id: 6, children: [{ label: 'child3', id: 7 }] }]; $('#tree1').tree({ data: data, autoOpen: false, dragAndDrop: true }); console.log("Original Structure" + $('#tree1').tree('toJson')); $('#tree1').bind( 'tree.move', function(event) { /* console.log('moved_node', event.move_info.moved_node); console.log('target_node', event.move_info.target_node); console.log('position', event.move_info.position); console.log('previous_parent', event.move_info.previous_parent); */ if (event.move_info.position == 'after') { if (event.move_info.previous_parent.id == event.move_info.target_node.id) { alert("parents are the same " + event.move_info.previous_parent.id + event.move_info.target_node.id); } alert("after"); } if (event.move_info.position == 'after') { } if (event.move_info.position == 'inside') { var family = ('vpai=' + event.move_info.target_node.id + '&vfilho=' + event.move_info.moved_node.id) $.ajax({ type: 'POST', url: 'link', data: family, success: function(data, textStatus) { console.log('DONE: Request has been successfully sent'); }, error: function(xhr, textStatus, errorThrown) { alert('Envio Falhou\\n\\nERR: ' + errorThrown); } }); } } ); });
#navdata { width: auto; height: auto; flex: 1; padding-bottom: 1px; } #navgrid { width: 50%; height: 200px; overflow-x: visible; overflow-y: scroll; border: solid 1px #79B7E7; background-color: white; } #header { background-color: #79B7E7; width: 99.6%; text-align: center; border: 1px solid white; margin: 1px; } .jqtree-element { background-color: white; border: 1px solid white; height: 23px; color: red; } .jqtree-tree .jqtree-title { color: black; } ul.jqtree-tree { margin-top: 0px; margin-left: 1px; } ul.jqtree-tree, ul.jqtree-tree ul.jqtree_common { list-style: none outside; margin-bottom: 0; padding: 0; } ul.jqtree-tree ul.jqtree_common { display: block; text-align: left; padding-left: 0px; margin-left: 20px; margin-right: 0; } ul.jqtree-tree li.jqtree-closed > ul.jqtree_common { display: none; } ul.jqtree-tree li.jqtree_common { clear: both; list-style-type: none; } ul.jqtree-tree .jqtree-toggler { color: #325D8A; } ul.jqtree-tree .jqtree-toggler:hover { color: #3966df; text-decoration: none; } .jqtree-tree .jqtree-title.jqtree-title-folder { margin-left: 0; } span.jqtree-dragging { color: #fff; background: #79B7E7; opacity: 0.8; cursor: pointer; padding: 2px 8px; } ul.jqtree-tree li.jqtree-selected > .jqtree-element, ul.jqtree-tree li.jqtree-selected > .jqtree-element:hover { background: -webkit-gradient(linear, left top, left bottom, from(#BEE0F5), to(#79B7E7)); }
<!DOCTYPE html> <!-- Programa: JqTree | Envia nova estrutura JSON como v pai e vfilho --> <!-- Autor: Calne Ricardo de Souza --> <!-- Data: 06/07/2015 --> <html> <head> <!--Removed due to copyrights--> </head> <body> <div id="navgrid"> <div id="header">Header</div> <div id="tree1"> <ul class="jqtree_common jqtree-tree"> <li class="jqtree_common jqtree-folder"> <div class="jqtree-element jqtree_common"> <a class="jqtree_common jqtree-toggler">â–¼</a> <span class="jqtree_common jqtree-title jqtree-title-folder">node1</span> </div> <ul class="jqtree_common "> <li class="jqtree_common"> <div class="jqtree-element jqtree_common"> <span class="jqtree-title jqtree_common">child2</span> </div> </li> <li class="jqtree_common"> <div class="jqtree-element jqtree_common"> <span class="jqtree-title jqtree_common">child1</span> </div> </li> </ul> </li> <li class="jqtree_common jqtree-folder"> <div class="jqtree-element jqtree_common"> <a class="jqtree_common jqtree-toggler">â–¼</a> <span class="jqtree_common jqtree-title jqtree-title-folder">node2</span> </div> <ul class="jqtree_common "> <li class="jqtree_common"> <div class="jqtree-element jqtree_common"> <span class="jqtree-title jqtree_common">child3</span> </div> </li> </ul> </li> </ul> </div> </div> </body> </html>
1 個解決方案
解決方案1
0 已采納 2015-08-12 13:30:50
孜孜不倦地工作之后，我終於想通了，它的工作原理是， if s為4
$(document).ready(function() { //Mandar o response aqui no data var data = [{ label: '1', id: 1, children: [{ label: '2', id: 2 }, { label: '3', id: 3 }] }, { label: '4', id: 4, children: [{ label: '5', id: 5 }] }]; $('#tree1').tree({ data: data, autoOpen: false, dragAndDrop: true }); console.log("Original Structure" + $('#tree1').tree('toJson')); $('#tree1').bind( 'tree.move', function(event) { console.log('______________________________________'); console.log('moved_node', event.move_info.moved_node.id); console.log('target_node', event.move_info.target_node.id); console.log('position', event.move_info.position); console.log('previous_parent', event.move_info.previous_parent.id); console.log('___'); console.log("target's parent", event.move_info.target_node.parent.id); var myNode = event.move_info.moved_node.id; var target = event.move_info.target_node.id; var myXDad = event.move_info.previous_parent.id; var targetsDad = event.move_info.target_node.parent.id; if (event.move_info.position == 'after') { if (target === myXDad) { if (targetsDad === undefined) { var family = ('vpai=' + 0 + '&vfilho=' + myNode); alert(family); send(family); } else { //get your target's dad as your dad var family = ('vpai=' + targetsDad + '&vfilho=' + myNode); alert(family); send(family); } } else if (!(myXDad === targetsDad)) { //get target's dad as your dad var family = ('vpai=' + 0 + '&vfilho=' + myNode); alert(family); send(family); } } if (event.move_info.position == 'inside') { var family = ('vpai=' + event.move_info.target_node.id + '&vfilho=' + event.move_info.moved_node.id) alert(family); send(family); } function send(family) { $.ajax({ type: 'POST', url: 'sistema.agrosys.com.br', data: family, success: function(data, textStatus) { console.log('DONE: Request has been successfully sent'); }, error: function(xhr, textStatus, errorThrown) { alert('Envio Falhou\\n\\nERR: ' + errorThrown); } }); } } ); });
<!DOCTYPE html> <!-- Programa: JqTree | Envia nova estrutura JSON como v pai e vfilho --> <!-- Autor: Calne Ricardo de Souza --> <!-- Data: 06/07/2015 --> <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="http://sistema.agrosys.com.br/sistema/labs/tree.jquery.js"></script> <link rel="stylesheet" href="http://sistema.agrosys.com.br/sistema/labs/jqtree.css"> <script src="http://sistema.agrosys.com.br/sistema/labs/jquery-cookie/src/jquery.cookie.js"></script> <style> #navdata { width: auto; height: auto; flex: 1; padding-bottom: 1px; } #navgrid { width: 50%; height: 200px; overflow-x: visible; overflow-y: scroll; border: solid 1px #79B7E7; background-color: white; } #header { background-color: #79B7E7; width: 99.6%; text-align: center; border: 1px solid white; margin: 1px; } .jqtree-element { background-color: white; border: 1px solid white; height: 23px; color: red; } .jqtree-tree .jqtree-title { color: black; } ul.jqtree-tree { margin-top: 0px; margin-left: 1px; } ul.jqtree-tree, ul.jqtree-tree ul.jqtree_common { list-style: none outside; margin-bottom: 0; padding: 0; } ul.jqtree-tree ul.jqtree_common { display: block; text-align: left; padding-left: 0px; margin-left: 20px; margin-right: 0; } ul.jqtree-tree li.jqtree-closed > ul.jqtree_common { display: none; } ul.jqtree-tree li.jqtree_common { clear: both; list-style-type: none; } ul.jqtree-tree .jqtree-toggler { color: #325D8A; } ul.jqtree-tree .jqtree-toggler:hover { color: #3966df; text-decoration: none; } .jqtree-tree .jqtree-title.jqtree-title-folder { margin-left: 0; } span.jqtree-dragging { color: #fff; background: #79B7E7; opacity: 0.8; cursor: pointer; padding: 2px 8px; } ul.jqtree-tree li.jqtree-selected > .jqtree-element, ul.jqtree-tree li.jqtree-selected > .jqtree-element:hover { background: -webkit-gradient(linear, left top, left bottom, from(#BEE0F5), to(#79B7E7)); } </style> </head> <body> <div id="navgrid"> <div id="header">Header</div> <div id="tree1"> <ul class="jqtree_common jqtree-tree"> <li class="jqtree_common jqtree-folder"> <div class="jqtree-element jqtree_common"> <a class="jqtree_common jqtree-toggler">â–¼</a> <span class="jqtree_common jqtree-title jqtree-title-folder">node1</span> </div> <ul class="jqtree_common "> <li class="jqtree_common"> <div class="jqtree-element jqtree_common"> <span class="jqtree-title jqtree_common">child2</span> </div> </li> <li class="jqtree_common"> <div class="jqtree-element jqtree_common"> <span class="jqtree-title jqtree_common">child1</span> </div> </li> </ul> </li> <li class="jqtree_common jqtree-folder"> <div class="jqtree-element jqtree_common"> <a class="jqtree_common jqtree-toggler">â–¼</a> <span class="jqtree_common jqtree-title jqtree-title-folder">node2</span> </div> <ul class="jqtree_common "> <li class="jqtree_common"> <div class="jqtree-element jqtree_common"> <span class="jqtree-title jqtree_common">child3</span> </div> </li> </ul> </li> </ul> </div> </div> </body> </html>
如何檢測用戶何時進入或離開游戲並獲取他們進入/離開的游戲名稱？
[英]How can I detect when a user enters or leaves a game and get the game name they entered/left?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.