codecamp

jQuery EasyUI 树形菜单 – 树形菜单拖放控制

jQuery EasyUI 树形菜单 - 树形菜单拖放控制

本节教你如何实现jQuery EasyUI树形菜单(Tree)的拖放控制。

当在一个应用中使用树(Tree)插件时,用户可以通过拖拽(drag)和放置(drop)功能来改变节点位置。启用拖拽(drag)和放置(drop)操作的方法是,把树(Tree)插件的'dnd'属性设置为true。

创建树形菜单(Tree)

	$('#tt').tree({
		dnd: true,
		url: 'tree_data.json'
	});

当在一个树节点上发生放置操作,'onDrop'事件将被触发,您应该做一些或更多的操作,例如保存节点状态到远程服务器端,等等。

	onDrop: function(targetNode, source, point){
        var targetId = $(target).tree('getNode', targetNode).id;
        $.ajax({
            url: '...',
            type: 'post',
            dataType: 'json',
            data: {
                id: source.id,
                targetId: targetId,
                point: point
            }
        });
    }

下载 jQuery EasyUI 实例

jeasyui-tree-tree5.zip

jQuery EasyUI 树形菜单 – 创建带复选框的树形菜单
jQuery EasyUI 树形菜单 – 树形菜单加载父/子节点
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

jQuery EasyUI 教程

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }