jQuery EasyUI Tree 增删改 编辑结点名称自动全选文本域

来源:互联网 发布:1002服务数据出现异常 编辑:程序博客网 时间:2024/04/30 03:47
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Tree - jQuery EasyUI Demo</title><link rel="stylesheet" type="text/css" href="../themes/default/easyui.css"><link rel="stylesheet" type="text/css" href="../themes/icon.css"><script type="text/javascript" src="../jquery-1.7.2.min.js"></script><script type="text/javascript" src="../jquery.easyui.min.js"></script><script type="text/javascript">$(function(){ var oldnodename =""; $('#tree').tree({url: 'tree_data.json',onLoadSuccess:function(node,data) {},onClick:function(node){var id = node.id;var text = node.text;alert(id+'ll'+text);},onContextMenu:function(e, node){e.preventDefault();var id = node.id;var rightbuttonobj =  $('#rightclickdiv');rightbuttonobj.menu('show', {left: e.pageX, top: e.pageY});rightbuttonobj.menu({ onClick:function(item){ if( item.name == '001' ){ var nodeid = appendnode(node); var newnode = $('#tree').tree('find',nodeid); $('#tree').tree('beginEdit',newnode.target); setCursorPos(nodeid); }else if( item.name == '002' ){ oldnodename = node.text; $('#tree').tree('beginEdit',node.target); var nodeid=node.id; setCursorPos(nodeid); }else if(item.name == '003' ){ $('#tree').tree('remove', node.target); } }  });},onAfterEdit:function(node){ $('#tree').tree('update',node);},onCancelEdit:function(node){//alert("onCancelEdit---");}});});//新增和修改结点名称时自动全选结点名称var setCursorPos = function(nodeid){var parnote=$("div[node-id='"+nodeid+"']");var titlespannote=$(parnote).children(".tree-title");var titleinput= $(titlespannote).children("input");var e1=titleinput[0];e1.select();}function appendnode(node){var nodeid = node.id;var newid = nodeid+"qqq";$('#tree').tree('append',{parent: (node?node.target:null),data:[{id:newid,text:'newnode',checked:true}]});return newid;}</script></head><body><div><ul id="tree" class="easyui-tree" animate="false"></ul></div><div id="rightclickdiv" class="easyui-menu" style="width: 115px;"><div data-options="iconCls:'icon-add',name:'001'">append</div><div data-options="iconCls:'icon-edit',name:'002'">update</div><div data-options="iconCls:'icon-remove',name:'003'">remove</div></div></body></html>


 

0 0