这是第一次使用zTree,所以在使用之前我要先写一个demo来学习一下。我们要注意的是,zTree是一个jQuery插件,所以我们在导入zTree的js文件之前要先导入jQuery的js文件。

  我们先下载zTree,点击我跳转到一个网站进行下载

  代码直接贴出来

<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/zTreeStyle.css">
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/jquery.ztree.all-3.1.min.js"></script>
</head> <body>
<div>
<ul id="treeDemo" class="ztree"></ul>
</div>
<script type="text/javascript">
var zTreeObj;
// zTree 的参数配置,深入使用请参考 API 文档(setting 配置详解)
var setting = {
callback:{
onClick:function(event,treeId,treeNode){
if(treeNode.ahref){
window.open(treeNode.ahref);
}else{
alert("此节点没有链接!")
} }
},
view:{
showIcon:false
}
};
// zTree 的数据属性,深入使用请参考 API 文档(zTreeNode 节点数据详解)
var zNodes = [
{
name: "test1",
open: true,
children: [{name: "test1_1",ahref:"https://www.baidu.com/"}, {name: "test1_2"}]},
{
name: "test2",
open: true,
children: [{name: "test2_1"}, {name: "test2_2"}]
}];
$(document).ready(function() {
zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
});
</script>
</body> </html>

  

  之前我在点击test1_1这个节点的时候弹出了两个页面,这个原因是我在设置children节点的时候把里面的链接直接使用的是url属性,这样就会使得我在点击节点时弹出两个页面,然后我把属性名改为了ahref之后就可以了。url估计是一个关键字,我们在设置链接时不要使用url。

jQuery插件--zTree中点击节点实现页面跳转时弹出两个页面的问题的更多相关文章

  1. ios兼容 input输入时弹出键盘框 页面整体上移键盘框消失后在ios上页面不能回弹的问题

    前端h5混合开发手机端ios  当有input输入时,手机下方弹出键盘使页面上移,当输入完成,键盘消失后页面显示回到原位,但实际不能点击(可点击上方区域,有反应),也就是说实际是没有回弹. 解决办法: ...

  2. Java实现文件上传-按钮弹出上传页面

    转自: https://blessht.iteye.com/blog/1405057 最近自己在做一个小系统玩的时候涉及到了文件的上传,于是在网上找到Java上传文件的方案,最后确定使用common- ...

  3. Jquery插件Ztree使用所遇问题

    问题1.$.fn.zTree为空或为Undefined 我在MVC中引用Jquery插件Ztree的JS并不存任何问题,而当我将Ztree的js引入项目中,就出现$.fn.zTree为空或为Undef ...

  4. jquery mobile页面跳转后,必须重新刷新页面js方可有效

    最近在做个项目,用到jquery mobile,很陌生对他,问题一个个的来,那就要一个个解决,找了一天这个问题,放可明白:首先明白jqm里面页面跳转默认都是通过ajax请求的,必须重新刷新页面js方可 ...

  5. iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案—scrollIntoView()

    问题描述 iOS系统下,移动web页面,inpu获取焦点弹出系统虚拟键盘时,偶尔会出现挡住input的情况,尽管概率不大,但是十分影响用户体验. 问题重现 原始页面:页面中有header.main.f ...

  6. iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案

    问题描述 iOS系统下,移动web页面,inpu获取焦点弹出系统虚拟键盘时,偶尔会出现挡住input的情况,尽管概率不大,但是十分影响用户体验. 问题重现 原始页面:页面中有header.main.f ...

  7. 页面跳转时,url 传大数据的参数不全的问题+序列化对象

    1.页面跳转时,url 传大数据的参数不全的问题 //传参: url: '/pages/testOfPhysical/shareEvaluation?detailInfo=' +encodeURICo ...

  8. 使用iframe框架后的页面跳转时目标页面变为iframe的子页面的问题

    <frameset rows="4,200,10,*,120" cols="*" framespacing="0" framebord ...

  9. selenium获取新页面标签页(只弹出一个新页面的切换)

    selenium获取新页面标签页(只弹出一个新页面的切换) windows = driver.current_window_handle #定位当前页面句柄 all_handles = driver. ...

随机推荐

  1. 关于c++的头文件依赖

    正在看google c++编程规范,里面对头文件依赖是这么说的: 使用前置声明(forward declarations)尽量减少.h文件中#include的数量. 当一个头文件被包含的同时也引入了一 ...

  2. SourceTree git的管理工具使用教程1

    1SourceTree是一个window系统下的Git管理工具 2设置Git 工具——选项——Git设置 3拷贝远程的项目 新建/克隆(输入远程项目的url地址) 4验证(填写用户信息) 工具——选项 ...

  3. 【SSH】——两种添加jar包方式的比较

    [前言] 在开发过程中,我们对Eclipse或MyEclipse等IDE越来越熟悉了.在使用的过程中,小编了解到两种添加jar包的方式,今天给大家说下这两种方式的差别. 方法一: 将所需要的jar包拷 ...

  4. Storm ui 显示异常

    今天安装storm集群的时候,各个进程也都起来,却发现Storm ui界面下无法观察Storm集群的状态 有很多地方处理不当都会造成这种现象: 1.storm.yaml配置不当 2.防火墙的问题 3. ...

  5. delphi数据库进行增加操作时,怎么判断插入的这个值是否已经存在?

    //增 procedure TForm1.btnAddClick(Sender: TObject); begin ADOQuery1.Close; ADOQuery1.SQL.Clear; ADOQu ...

  6. 【bzoj2152】聪聪可可 树的点分治

    题目描述 聪聪和可可是兄弟俩,他们俩经常为了一些琐事打起来,例如家中只剩下最后一根冰棍而两人都想吃.两个人都想玩儿电脑(可是他们家只有一台电脑)……遇到这种问题,一般情况下石头剪刀布就好了,可是他们已 ...

  7. [洛谷P2657][SCOI2009]windy数

    题目大意:不含前导零且相邻两个数字之差至少为$2$的正整数被称为$windy$数.问$[A, B]$内有多少个$windy$数? 题解:$f_{i, j}$表示数有$i$位,最高位为$j$(可能为$0 ...

  8. hdu4418 Time travel 【期望dp + 高斯消元】

    题目链接 BZOJ4418 题解 题意:从一个序列上某一点开始沿一个方向走,走到头返回,每次走的步长各有概率,问走到一点的期望步数,或者无解 我们先将序列倍长形成循环序列,\(n = (N - 1) ...

  9. 【BZOJ 4034】[HAOI2015]树上操作 差分+dfs序+树状数组

    我们只要看出来这道题 数组表示的含义就是 某个点到根节点路径权值和就行 那么我们可以把最终答案 看做 k*x+b x就是其深度 ,我们发现dfs序之后,修改一个点是差分一个区间,修改一个点的子树,可以 ...

  10. Spring事务管理—aop:pointcut expression 常见切入点表达式及事务说明

    Spring事务管理—aop:pointcut expression 常见切入点表达式及事物说明 例: <aop:config>  <aop:pointcut expression= ...