html5 jstree树形菜单,JSTree 大型树形菜单控件(基于jQuery)

本文展示了如何使用JSTree和jQuery创建一个交互式的HTML5树形菜单。菜单与TinyMCE编辑器集成,允许用户编辑节点内容,并通过AJAX与服务器进行交互,实现文件的保存、加载、重命名、移动和删除操作。同时,文章还介绍了键盘快捷键以增强用户体验。
摘要由CSDN通过智能技术生成

$(function () {

Panel = {};

// TinyMCE setup

Panel.tinyMCE = new tinymce.Editor('editor-panel', {

mode : "exact",

elements : "editor",

theme : "advanced",

theme_advanced_toolbar_location : "top",

theme_advanced_toolbar_align : "left",

height : "342",

theme_advanced_buttons1 : "savebutton,separator,bold,italic,underline,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,bullist,numlist",

theme_advanced_buttons2 : "",

theme_advanced_buttons3 : ""

});

Panel.tinyMCE.addButton('savebutton', {

title : 'Save',

image : 'full/images/save.png',

onclick : function() {

if(Panel.jsTree.selected && !Panel.tinyMCE.isHidden()) {

$.post('full/server.php?server&type=savefile',{ data : Panel.tinyMCE.getContent(), lang : ($.inArray(Panel.jsTree.current_lang, Panel.jsTree.settings.languages) + 1), id : Panel.jsTree.selected.attr("id") });

}

}

});

Panel.tinyMCE.onChange.add(function(ed, l) {

Panel.tinyMCE.content_edited = true;

});

Panel.tinyMCE.render_state = 0;

// jsTree setup

Panel.jsTree = $.tree_create();

Panel.jsTree.init($("#tree-panel .tree"),{

data : { type : "json", async

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值