【ztree】zTree节点增删改
1.对节点增删改查
今天遇到一个需求是对zTree的节点进行增删改,经过查阅资料总结如下:
效果:
完成增删改,要注意几个关键点:
- 使用 编辑功能,必须设置 setting.edit 中的各个属性
- 使用 编辑功能的事件回调函数,必须设置 setting.callback.beforeRemove / onRemove / beforeRename / onRename 等属性
- zTree 不提供默认的增加按钮,如要实现需要利用自定义控件的方法 addHoverDom / removeHoverDom
- 我们利用 beforeEditName 来触发自定义的编辑操作
首先,我们来看看具体的配置信息(详细内容见代码中的注释):
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title>zTree测试</title>
<link rel="stylesheet" type="text/css" href="css/demo.css" />
<link rel="stylesheet" type="text/css" href="css/zTreeStyle/zTreeStyle.css" />
<script src="js/jquery-1.4.4.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.ztree.all.js" type="text/javascript" charset="utf-8"></script>
</head>
<script type="text/javascript">
var zTree;
var setting = {
view:{
addHoverDom:addHoverDom,
removeHoverDom:removeHoverDom,
selectedMulti:false
},
edit: {
enable: true,
editNameSelectAll:true,
removeTitle:'删除',
renameTitle:'重命名'
},
data: {
/* keep:{
parent:true,
leaf:true
}, */
simpleData: {
enable: true
}
},
callback:{
beforeRemove:beforeRemove,//点击删除时触发,用来提示用户是否确定删除(可以根据返回值 true|false 确定是否可以删除)
beforeEditName: beforeEditName,//点击编辑时触发,用来判断该节点是否能编辑
beforeRename:beforeRename,//编辑结束时触发,用来验证输入的数据是否符合要求(也是根据返回值 true|false 确定是否可以编辑完成)
onRemove:onRemove,//(beforeRemove返回true之后可以进行onRemove)删除节点后触发,用户后台操作
onRename:onRename,//编辑后触发,用于操作后台
beforeDrag:beforeDrag,//用户禁止拖动节点
onClick:clickNode//点击节点触发的事件
}
};
var zNodes =[
{ id:1, pId:0, name:"父节点 1", open:true},
{ id:11, pId:1, name:"去百度",url:'http://www.baidu.com',target:'_blank'},
{ id:12, pId:1, name:"叶子节点 1-2"},
{ id:13, pId:1, name:"叶子节点 1-3"},
{ id:2, pId:0, name:"父节点 2", open:true},
{ id:21, pId:2, name:"叶子节点 2-1"},
{ id:22, pId:2, name:"叶子节点 2-2"},
{ id:23, pId:2, name:"叶子节点 2-3"},
{ id:3, pId:0, name:"父节点 3", open:true},
{ id:31, pId:3, name:"叶子节点 3-1"},
{ id:32, pId:3, name:"叶子节点 3-2"},
{ id:33, pId:3, name:"叶子节点 3-3"}
];
$(document).ready(function(){
zTree = $.fn.zTree.init($("#tree"), setting, zNodes);
});
function beforeRemove(e,treeId,treeNode){
return confirm("你确定要删除吗?");
}
function onRemove(e,treeId,treeNode){
if(treeNode.isParent){
var childNodes = zTree.removeChildNodes(treeNode);
var paramsArray = new Array();
for(var i = 0; i < childNodes.length; i++){
paramsArray.push(childNodes[i].id);
}
alert("删除父节点的id为:"+treeNode.id+"\r\n他的孩子节点有:"+paramsArray.join(","));
return;
}
alert("你点击要删除的节点的名称为:"+treeNode.name+"\r\n"+"节点id为:"+treeNode.id);
}
function beforeEditName(treeId,treeNode){
/* if(treeNode.isParent){
alert("不准编辑非叶子节点!");
return false;
} */
return true;
}
function beforeRename(treeId,treeNode,newName,isCancel){
if(newName.length < 3){
alert("名称不能少于3个字符!");
return false;
}
return true;
}
function onRename(e,treeId,treeNode,isCancel){
alert("修改节点的id为:"+treeNode.id+"\n修改后的名称为:"+treeNode.name);
}
function clickNode(e,treeId,treeNode){
if(treeNode.id == 11){
location.href=treeNode.url;
}else{
alert("节点名称:"+treeNode.name+"\n节点id:"+treeNode.id);
}
}
function beforeDrag(treeId,treeNodes){
return false;
}
var newCount = 1;
function addHoverDom(treeId,treeNode){
var sObj = $("#" + treeNode.tId + "_span");
if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
+ "' title='添加子节点' onfocus='this.blur();'></span>";
sObj.after(addStr);
var btn = $("#addBtn_"+treeNode.tId);
if (btn) btn.bind("click", function(){
//在这里向后台发送请求保存一个新建的叶子节点,父id为treeNode.id,让后将下面的100+newCount换成返回的id
//zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"新建节点" + (newCount++)});
alert("开始添加节点")
return false;
});
}
function removeHoverDom(treeId,treeNode){
$("#addBtn_"+treeNode.tId).unbind().remove();
}
</script>
<body>
<ul id="tree" class="ztree"></ul>
</body>
</html>
最后附一个完整的与后台交互的例子:
/***********S QLQ*********************/
var zTree;
var setting = {
view : {
addHoverDom : addHoverDom,
removeHoverDom : removeHoverDom,
selectedMulti : false
},
edit : {
enable : true,
editNameSelectAll : true,
removeTitle : '删除',
renameTitle : '重命名'
},
data : {
key : {
name:"typeName"
},
/* keep:{
parent:true,
leaf:true
}, */
simpleData : {
enable : true,
idKey: "typeId",
pIdKey: "upId",
rootPId: 1
}
},
callback : {
beforeRemove : beforeRemove,//点击删除时触发,用来提示用户是否确定删除
beforeEditName : beforeEditName,//点击编辑时触发,用来判断该节点是否能编辑,是否进入编辑状态
beforeRename : beforeRename,//编辑结束时触发,用来验证输入的数据是否符合要求
onRemove : onRemove,//删除节点后触发,用户后台操作
onRename : onRename,//编辑后触发,用于操作后台
onClick : clickNode
//点击节点触发的事件
}
};
function geneTypeTree(){
$.getJSON(contextPath+"/trainacontentType_getTraincontenttypeTree.action",function(response){
var zNodes = response.traincontenttypeTree;
zTree = $.fn.zTree.init($("#tree"),setting,zNodes);
});
} $(document).ready(function() {
geneTypeTree();
}); /******S 删除*******/
function beforeRemove(treeId, treeNode) {
if(confirm("确认删除?\n将会删除下面的所有视频!")){
if(treeNode.isParent){
alert("该目录下面还有子目录,请从最底层目录开始删除!");
return false;
}
return true;
}
return false;
}
function onRemove(e, treeId,treeNode) {
var typeId = treeNode.typeId;
$.post(contextPath+"/trainacontentType_deleteTrainContentTypeById.action",
{"typeId":typeId},
function(repsonse){
alert(repsonse.result);
if("删除成功"==repsonse.result)//删除成功之后执行查询
btnFindFy();
}
,'json') }
/******E 删除*******/ function beforeEditName(treeId,treeNode) {
/* if(treeNode.isParent){
alert("不准编辑非叶子节点!");
return false;
} */
return true;
} function beforeRename(treeId,treeNode, newName,isCancel) {
if (newName.length < 3) {
alert("名称不能少于3个字符!");
return false;
}
return true;
}
function onRename(e, treeId,treeNode, isCancel) {
if(confirm("您确认修改类别名称?")){
$.post(contextPath+"/trainacontentType_updateTraincontenttypeName.action",
{
"traincontenttype.typeid":treeNode.typeId,
"traincontenttype.typename":treeNode.typeName
},
function(response){
if(response != null){
if("修改成功"==response.result){
alert(response.result);
}
}
}
,
'json');
}
} /************S 点击事件*********/
function clickNode(e, treeId,treeNode) {
$("#trainContentTypeId").val(treeNode.typeId);//向隐藏的类别编号赋值
$("[name='typeId']").val(treeNode.typeId);//向隐藏的类别编号赋值
$("#yeHao").val("1");
btnFindFy();
}
/************E 点击事件*********/ function addHoverDom(treeId,treeNode) {
var sObj = $("#"+ treeNode.tId+ "_span");
if (treeNode.editNameFlag|| $("#addBtn_"+ treeNode.tId).length > 0)
return;
var addStr = "<span class='button add' id='addBtn_"+ treeNode.tId+ "' title='添加子节点' onfocus='this.blur();'></span>";
sObj.after(addStr);
var btn = $("#addBtn_"+ treeNode.tId);
if (btn)btn.bind("click",function() {
if(confirm("确认在该目录下面添加培训内容类别?")){
var typeName = prompt("请输入类别名称");//获取到的名字
if(typeName != null){//点击确定
if(typeName.length>1){
var upId = treeNode.typeId;//上级编号
$.post(contextPath+"/trainacontentType_addTraincontenttype.action",
{
"traincontenttype.upid":upId,
"traincontenttype.typename":typeName
},
function(response){
if(response!=null){
alert(response.result);
}
if(response.result == "添加成功" ){
var traincontenttype = response.traincontenttype;//获取返回来的数据
zTree.addNodes(treeNode, {typeId:traincontenttype.typeid, upId:treeNode.id, typeName:typeName});
}
// geneTypeTree();
},
'json');
}else{
alert("请输入正确的类别名称")
}
}
}
//在这里向后台发送请求保存一个新建的叶子节点,父id为treeNode.id,让后将下面的100+newCount换成返回的id
//zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"新建节点" + (newCount++)});
return false;
});
}
function removeHoverDom(treeId,treeNode) {
$("#addBtn_" + treeNode.tId).unbind().remove();
}
下面附一个更加详细的最近用到的树: (包含展开所有节点,点击,重命名,删除,添加等事件,以及验证操作)
/********S 左边树相关操作**********/
/**
* 查询课程类别树结构
*/
function getTypeTree(){
$.getJSON(contextPath + '/courseType/getTypeTree.do',{"trainSchemeId":$("#trainSchemeId").val()},geneTypeTree);
} /**
* 生成课程类别树函数
* @param typeTree 返回的课程类别信息(多一条虚拟的课程类别节点)
*/
function geneTypeTree(typeTree){
var setting = {
view : {
addHoverDom : addHoverDom,//用于当鼠标移动到节点上时,显示用户自定义控件,显示隐藏状态同 zTree 内部的编辑、删除按钮
removeHoverDom : removeHoverDom,//用于当鼠标移出节点时,隐藏用户自定义控件,显示隐藏状态同 zTree 内部的编辑、删除按钮
selectedMulti : false //设置是否允许同时选中多个节点。
},
edit : {
enable : true,//设置 zTree 是否处于编辑状态
editNameSelectAll : true,//节点编辑名称 input 初次显示时,设置 txt 内容是否为全选状态。
removeTitle : '删除课程类别',
renameTitle : '重命名课程类别'
},
data : {
simpleData : {
enable : true,
idKey : "typenum",
pIdKey : "uptypenum",
rootPId : "1"
},
key : {
name : "typename",
}
},
callback : {
beforeRemove : beforeRemove,//点击删除时触发,用来提示用户是否确定删除
beforeEditName : beforeEditName,//点击编辑时触发,用来判断该节点是否能编辑
beforeRename : beforeRename,//编辑结束时触发,用来验证输入的数据是否符合要求
onRemove : onRemove,//删除节点后触发,用户后台操作
onRename : onRename,//编辑后触发,用于操作后台
onClick : clickNode//点击节点触发的事件
}
};
var treeNodes = typeTree;//树节点数据(从后台获取)
$.fn.zTree.init($("#treeDiv"), setting, treeNodes);//在界面生成一颗树
openAllTreenode();//展开树的所有节点
} /**
* 展开树的所有节点
*/
function openAllTreenode(){ // 获取树对象
var treeObj = $.fn.zTree.getZTreeObj("treeDiv");
/* 获取所有树节点 */
var nodes = treeObj.transformToArray(treeObj.getNodes());
// 展开除第一级之外的其他节点
for (var i = 0, length_1 = nodes.length; i < length_1; i++) {
if(nodes[i].level == 0){
continue;
}
nodes[i].open = true;
}
//展开第一级节点
treeObj.expandNode(nodes[0], true); } /******S 删除*******/
/**
* 删除前的询问(验证是否可以删除)
* @param treeId
* @param treeNode 需要删除的树节点
* @returns {boolean} 是否可以执行删除函数
*/
function beforeRemove(treeId, treeNode) {
var layer =getLauiLayer();
if(treeNode.level == 0){
layer.msg("您不可以删除根节点!请从二级节点开始操作!",{icon:2,shade: [0.8, '#393D49']})
return false;
}
if(treeNode.isParent){
layer.msg("该目录下面还有子目录,请从最底层目录开始删除!",{icon:2,shade: [0.8, '#393D49']})
return false;
}
//如果表格中有数据就不让删除
if($("#trainCourseTbody").children("tr").length>0){
layer.msg("该节点已经排有课程,不允许删除课程类别!先删除培养方案课程!",{icon:2,time:2*1000,shade: [0.8, '#393D49']});
return false;
}
if(confirm("确认删除?")){
return true;
}
return false;
} /**
* 删除的操作
* @param e 事件
* @param treeId 树的界面中的ID
* @param treeNode 节点
*/
function onRemove(e, treeId,treeNode) {
var layer = getLauiLayer();
var trainSchemeId = getTrainSchemeId();//培养方案编号
var typeNum = treeNode.typenum;//类别num
$.post(contextPath+"/courseType/deleteCourseType.do",{"trainSchemeId":trainSchemeId,"typeNum":typeNum},function (response) {
layer.msg(response,{time:2*1000,shade: [0.8, '#393D49']},function () {
if("删除成功" == response){
getTypeTree();//重新生成树
//1.清空条件
var form = $("#queryTrainCourseForm");
form.find("input").not("#queryTrainCourseTrainshemeId").val("");
form.find("select").val("");
//2.重新查询一次
queryTrainCourseByCondition();
}
})
},'text')
}
/******E 删除*******/ /****S 编辑根节点****/
/**
* 验证是否可以进入编辑模式
* @param treeId
* @param treeNode
* @returns {boolean} true|false代表是否进入编辑模式
*/
function beforeEditName(treeId,treeNode) {
var layer;
layui.use(['layer'],function () {
layer = layui.layer;
});
//如果是根节点不允许编辑
if(treeNode.level == 0 ){
layer.msg("您不能编辑根节点!",{icon:2,shade: [0.8, '#393D49']});
return false;
}
return true;
} /**
* 用于捕获节点编辑名称结束(Input 失去焦点 或 按下 Enter 键)之后,更新节点名称数据之前的事件回调函数,并且根据返回值确定是否允许更改名称的操作
* @param treeId
* @param treeNode
* @param newName
* @param isCancel
* @returns {boolean} 是否成功
*/
function beforeRename(treeId,treeNode, newName,isCancel) {
var layer;
layui.use(['layer'],function () {
layer = layui.layer;
})
if (($.trim(newName)).length < 2) {
layer.alert("名称不能少于2个字符!")
return false;
}
return true;
} /**
* 修改名称的操作(正经的修改传到后台进行操作)
* @param e
* @param treeId
* @param treeNode
* @param isCancel
*/
function onRename(e, treeId,treeNode, isCancel) {
//如果选择了取消,重新查一下树
if(isCancel == true){
getTypeTree()
return false;
}
if(confirm("您确认修改类别名称?")) {
$.post(contextPath+"/courseType/updateCourseType.do",
{
"trainSchemeId":$("#trainSchemeId").val(),
"typeNum":treeNode.typenum,
"typeName":treeNode.typename
},
function(response){
if(response != null){
var layer;
layui.use("layer",function () {
layer = layui.layer;
});
layer.msg(response,{shade: [0.8, '#393D49'],time:2*1000,icon:1},function () {
if("修改成功"==response){
getTypeTree();//修改成功之后重新查一下树
}
})
}
}
,
'text');
}else {//如果选择了取消重新查一下树
getTypeTree();//取消之后重新查树
} } /****E 编辑根节点****/ /************S 点击事件*********/
/**
* 点击事件
* @param e 事件
* @param treeId 树节点的ID
* @param treeNode 树节点
*/
function clickNode(e, treeId,treeNode) {
$("#trainCourseTypeNum").val(treeNode.typenum);//向隐藏的课程类别编号赋值(最后添加到表单中传到后台保存)
$("#trainCourseTypeName").val(treeNode.typename);//
$("#typeNum_0").val(treeNode.typenum);//向隐藏的课程类别编号赋值
// queryTrainCourseByCondition();//分页查询培养方案课程信息
clearConditionAndQueryTrainCourse();
}
/************E 点击事件*********/ /**
* 增加一个课程类别事件(自定义组件),用于当鼠标移动到节点上时,显示用户自定义控件,显示隐藏状态同 zTree 内部的编辑、删除按钮
* @param treeId 树节点在界面的编号
* @param treeNode 树节点
*/
function addHoverDom(treeId,treeNode) {
//1.初始化layer模块
var layer;
layui.use(['layer'],function () {
layer = layui.layer;
})
//2.
var sObj = $("#"+ treeNode.tId+ "_span");
if (treeNode.editNameFlag|| $("#addBtn_"+ treeNode.tId).length > 0)
return;
var addStr = "<span class='button add' id='addBtn_"+ treeNode.tId+ "' title='添加子节点' onfocus='this.blur();'></span>";
sObj.after(addStr);
var btn = $("#addBtn_"+ treeNode.tId);
if (btn)btn.bind("click",function() {//增加的业务逻辑写在这里
var name = treeNode.typename ; //获取到当前的节点的名称
var typenum = treeNode.typenum ; //获取到当前的节点的编号
var layer = getLauiLayer();
//如果是叶子节点并且排有课程不允许再添加
if(!treeNode.isParent &&$("#trainCourseTbody").children("tr").length>0){
layer.msg("该节点已经排有课程,不允许添加课程类别!",{icon:2,time:2*1000,shade: [0.8, '#393D49']});
return;
}
if(confirm("确认在类别 "+name+" 下添加新的类别?")){
//1.向隐藏的地方赋值
$(".clear-input").val("");//清空残留的数据
$("#addType_uptypenum").val(typenum);//上级编号
$("#add_trainingschemeid").val($("#trainSchemeId").val());//培养方案编号
$("#addType_upTypeName").val(name);//上级类别名称
$("#addType_remark").val("无");//描述默认无
//2.打开模态框
var index = layer.open({
title:'添加课程类别',
area: [$(window).width()*0.80+'px', $(window).height()*0.70 +'px'],//大小
fix: true, //不固定
maxmin: true,
zIndex:500,
shadeClose: false,
shade:0.4,
type:1,
content:$('#addTypeModal')
});
//向页面隐藏index
$("#hidden_addType_index").val(index);
}
});
} /**
*用于当鼠标移出节点时,隐藏用户自定义控件,显示隐藏状态同 zTree 内部的编辑、删除按钮
* @param treeId
* @param treeNode
*/
function removeHoverDom(treeId,treeNode) {
$("#addBtn_" + treeNode.tId).unbind().remove();
}
/********S 左边树相关操作**********/
效果:
2. 对树进行检索
在数据很多的情况下,树形结构会变得比较复杂。需要增加关键字查询功能,如下:
HTML代码:
<!--树-->
<div class="el_leftTree">
<!--标题类,添加了一个颜色-->
<span class="el_treeTitle">检修单位</span>
<select class="btn btn-default mark-type" id="el_bigStatusMark" title="请选择" onchange="historyBigInfoFind()">
<option value="0">当前检修</option>
<option value="1">历史检修</option>
</select>
<div style="margin: 5px 0px;">
<input type="text" id="keyword" style="width: 80%;" placeholder="关键字" onchange="filterKeywords()"/>
</div>
<ul id="departmentAndOverHaulTree" class="ztree"></ul>
</div>
需要引入的JS
JS代码:
/*******S 增加关键字搜索功能**********/
/**
* 查找子结点,如果找到,返回true,否则返回false
*/
function searchChildren(keyword,children){
if(children == null || children.length == 0){
return false;
}
for(var i = 0;i < children.length;i++){
var node = children[i];
if(node.name.indexOf(keyword)!=-1){
return true;
}
//递归查找子结点
var result = searchChildren(keyword,node.children);
if(result){
return true;
}
}
return false;
} /**
* 查找当前结点和父结点,如果找到,返回ture,否则返回false
*/
function searchParent(keyword,node){
if(node == null){
return false;
}
if(node.name.indexOf(keyword)!=-1){
return true;
}
//递归查找父结点
return searchParent(keyword,node.getParentNode());
} var hiddenNodes = []; //用于存储被隐藏的结点 //过滤ztree显示数据
function filterKeywords(){
var ztreeObj = $.fn.zTree.getZTreeObj("departmentAndOverHaulTree");
//显示上次搜索后隐藏的结点
ztreeObj.showNodes(hiddenNodes);
//查找不符合条件的结点
//返回true表示要过滤,需要隐藏,返回false表示不需要过滤,不需要隐藏
function filterFunc(node){
var keyword=$("#keyword").val();
//如果当前结点,或者其父结点可以找到,或者当前结点的子结点可以找到,则该结点不隐藏
if(searchParent(keyword,node) || searchChildren(keyword,node.children)){
return false;
}
return true;
}; //获取不符合条件的叶子结点
hiddenNodes=ztreeObj.getNodesByFilter(filterFunc); //隐藏不符合条件的叶子结点
ztreeObj.hideNodes(hiddenNodes);
};
/*******E 增加关键字搜索功能**********/
【ztree】zTree节点增删改的更多相关文章
- zkCli的使用 常用的节点增删改查命令用法
zkCli的使用 常用的节点增删改查命令用法 1. 建立会话 命令格式:zkCli.sh -timeout 0 -r -server ip:port ./zkCli.sh -server -time ...
- Zookeeper节点增删改查与集群搭建(笔记)
1.上传文件目录说明 上传的文件一般放在 /home/下 安装文件一般在 /usr/local/下 2. 安装zookeeper 2.1将zookeeper-3.4.11.tar.gz拷贝到/home ...
- DOM操作 JS事件 节点增删改查
--------------------------习惯是社会的巨大的飞轮和最可贵的维护者.——威·詹姆斯 day 49 [value属性操作] <!DOCTYPE html><ht ...
- java中XML操作:xml与string互转、读取XML文档节点及对XML节点增删改查
一.XML和String互转: 使用dom4j程式变得很简单 //字符串转XML String xmlStr = \"......\"; Document document = D ...
- JS DOM节点增删改查 属性设置
一.节点操作 增 createElement(name)创建元素 appendChild();将元素添加 删 获得要删除的元素 获得它的父元素 使用removeChild()方法删除 改 第一种方 ...
- Ztree树节点应用
树节点增删改查: 前台jsp页面: <% String root=request.getContextPath();//获取项目目录 %> <SCRIPT type="te ...
- ant-design-vue中tree增删改
ant-design-vue中tree增删改 1. 使用背景 新项目中使用了ant-design-vue组件库.该组件库完全根基数据双向绑定的模式实现.只有表单组件提供少量的方法.所以,在使用ant- ...
- 可编辑树Ztree的使用(包括对后台数据库的增删改查)
找了很多网上关于Ztree的例子和代码才搞定. 首先,关于Ztree的代码不介绍了,网上下载之后,引用下列四个文件就能使用了. 1.关于配置选项.主要通过回调函数来实现向后台发送数据,实现增删改查. ...
- ztree使用系列三(ztree与springmvc+spring+mybatis整合实现增删改查)
在springmvc+spring+mybatis里整合ztree实现增删改查,上一篇已经写了demo,以下就仅仅贴出各层实现功能的代码: Jsp页面实现功能的js代码例如以下: <script ...
随机推荐
- JavaScript 字符串分行、Return 语句使用注意事项
JavaScript 字符串分行 JavaScript 允许我们在字符串中使用断行语句: var x ="Hello World!"; 但是,在字符串中直接使用回车换行是会报错的: ...
- Labyrinth POJ - 1383
Labyrinth POJ - 1383 The northern part of the Pyramid contains a very large and complicated labyrint ...
- C#入门篇5-8:流程控制语句 break语句
#region break语句 public class Breakapp { public static void Fun1() { //计算1+2+…+100的求和程序,打印显示每次循环计算的结果 ...
- jquery实现轮播插件
这几天用jquery写了两个轮播的插件,功能很简单.第一次尝试写插件,有很多不足的地方,代码如下: 注:图片链接请替换掉,配置信息必须加上图片width和height. <!DOCTYPE ht ...
- PyInstaller打包python脚本
用python写的工具写好了,想打包然后发给测试同事使用,最后选择了PyInstaller,支持Windows.Linux.OS X,支持打包成一个文件夹或单个EXE文件. 我是直接在线安装的,在 ...
- Python-S9-Day125-Web微信&爬虫框架之scrapy
01 今日内容概要 02 内容回顾:爬虫 03 内容回顾:网络和并发编程 04 Web微信之获取联系人列表 05 Web微信之发送消息 06 为什么request.POST拿不到数据 07 到底使用j ...
- python学习-- django 2.1.7 ajax 请求 进阶版
#原来版本 $.get("/add/",{'a':a,'b':b}, function(ret){ $('#result').html(ret)}) #进阶版 $.get(&qu ...
- 处理python字符串中的中文字符
# -*- coding:utf-8 -*- import sys,os txta = open('a.txt','r') str = '' for line in txta: str += line ...
- js跨域post请求
function funPostBack(srvMethod){ /* var contentNR=$(document.getElementById("reportFrame") ...
- jquery操作select(取值,设置选中
比如<select class="selector"></select> 1.设置value为pxx的项选中 $(".selector" ...