当前位置: 代码迷 >> Ajax >> dtree、ajax和jquery、contextmenu结合使用出现的有关问题
  详细解决方案

dtree、ajax和jquery、contextmenu结合使用出现的有关问题

热度:436   发布时间:2013-11-19 22:55:29.0
dtree、ajax和jquery、contextmenu结合使用出现的问题!求助
我现在出现的问题是第一个节点可以绑定contextMenu,但是当点击完此节点加载完其子节点后,右键菜单就失效了,请高手指教,如何在子节点动态加载后都能绑定contextMenu?如图,这是开始只有父节点时的效果图:



当我点击了父节点,加载完子节点后,再点击右键,则contextmenu失效了,我想动态地为每个节点添加contextmenu该怎么做?

js代码:

var l_tree = document.getElementById("l_tree_d");
var tree = new dTree("tree");//创建一个对象. 


$(document).ready(function(){
$("#1").contextMenu('myMenu', {});
});
 
    tree.add(0,-1,'MyTree')
    //显示根节点
    var jar = new Node(1,0,'JAR名',"javaScript:getMoreNodes('../treeNodes/NodesPrint','1');",'JAR名');
    tree.aNodes[tree.aNodes.length] = jar;
    jar._hc=true;
     
  //    动态显示节点      
 function getMoreNodes(addr,pId){
      $.ajax({    
    url:addr,    
    type:"POST", //数据发送方式       
    data:{"parentId":pId},
    dataType:"xml", //接受数据格式     
    error:function(json){   
             alert( "not lived!");   
      },   
    async: false ,//同步方式     
    success: function(xml){ 
        $(xml).find("node").each(function(){    
        var nodeId=$(this).attr("nodeId"); 
        var parentId=$(this).attr("parentId");
        var nodeType=$(this).attr("nodeType");
        var addr=$(this).attr("address");  
        var nodeName=$(this).text(); 
        var child = new Node(nodeId,parentId,nodeName,"javaScript:getMoreNodes('"+addr+"','"+nodeId+"')",nodeName);
        tree.aNodes[tree.aNodes.length] = child;
         if(nodeType == "0" ){
        child._hc = true;
         }
          });   
           }
     });
    l_tree.innerHTML = tree;
     }  
 
  document.write(tree);

jsp代码:

<%@ page language="java" contentType="text/html; charset=utf-8"%>


<%
String path = request.getContextPath();
 %>
  <!-- 180px建议 -->
  <!-- 树框架 -->
<HTML>
<HEAD>
<link rel="stylesheet" type="text/css"
href="../dtree/dtree.css">
<script type="text/javascript"
src="../dtree/jquery-1.4.4.min.js"></script>
<script type="text/javascript"
src="../dtree/dtree.js"></script>
<script type="text/javascript"
src="../dtree/jquery.contextmenu.js"></script>
<script type="text/javascript">

</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
<!--
body {
background-color: #D8E5F4;
}
-->
</style>
</HEAD>


<BODY>
<div id="l_tree_d">
<script type="text/javascript"
src="../dtree/showtree.js"></script>
</div>
<div>
<form action="../treeNodes/JarUpLoadServlet" method="post" enctype="multipart/form-data">
        <input type="file" name="up">
        <input type="submit" value="提交">
    </form>
</div>
<div class="contextMenu" id="myMenu">
<ul>
<li id="add">
<a >添加节点</a>
</li>
<li id="update">
<a >修改节点</a>
</li>
<li id="delete">
<a >删除节点</a>
</li>
</ul>
</div>
</BODY>
</HTML>
js

------解决方案--------------------
设置innerHTML后重新绑定事件
  相关解决方案