前端阻止冒泡事件、将项目打包并安装在当前环境中、请求路径参数传递方式、JQ触发动态添加元素、position绝对定位和相对定位、js中动态添加id、Corpus项目部署上线
一、前端阻止冒泡事件
举例:button里面有个span标签,button和span都绑定了点击事件,点击span不会触发button的点击事件
思路:阻止冒泡到上一层 在内部标签span中加入:event.stopPropagation();
二、将项目打包并安装在当前环境中
将本地python项目代码打包成包并安装在环境中,具体的setup.py文件写法还需要百度了解,这里只提供思路
进入项目目录,项目目录存在setup.py文件
打包命令:python setup.py install
三、请求路径参数传递,项目中涉及到的几种路径传参
1.前端请求地址:"/search_label?label="+inputvalue
浏览器上显示路由:127.0.0.1:5000/search_label?label=肺 后端请求地址写法: @bp.route("/search_label",method=["GET","POST"]) 注意:在注册路由的时候不用写?后面的参数 label=request.values["label"] #通过request获取传递的参数
2.前端请求地址:"/label_detail/"+label_name
浏览器上显示路由:127.0.0.1:5000/label_detail/肺癌 后端请求地址写法: @bp.route("/label_detail/<string:label_name>",methods=["POST","GET"]) #通过路径直接将参数传入视图函数中
def label_detail(label_name):
pass
3.通过ajax传递参数:json格式参数
在视图函数中通过value=request.get_data()获取ajax传递过来的参数
value=json.loads(value) #反序列化value 不同点在于:
1.前端请求地址?后面的参数,然后通过request方法获取参数 2.第二种方法不加问号的,在后端都需要用<>包裹参数值,可以不设置参数数据类型,直接用<>,不需要通过request获取,直接通过视图函数传参
四、Jquery append动态添加元素后,不触发定义好的事件怎么解决
动态生成的元素,使用.on绑定事件, $(父节点).on(“事件”,“目标节点”,function(){})
比如:$(document).on("click",".divclick",function(){}) 如果不绑定父节点,可以直接绑定body(是一个通用的方法) $(this) 和 this 区别,$(this) 代表jquery对象,等同通过选择器如$("#id")获取的对象;而 this 代表的是html元素本身
举例:动态加入的标签删除按钮,点击删除触发
$("body").on("click", ".delete", function () { 其他代码 });
五、position绝对定位和相对定位
position 绝对定位和相对定位
1.left和top都要写 absolute:绝对定位 即将对象从文档流中拖出 ralative相对定位 正常文档流中偏移位置,对象原来占有的位置保留,后面的对象按原来的文档任然保持原来的位置
六、js中动态添加id
注意:最好用一个字符串和id拼接,不然容易出错误
在遍历中动态添加id: "<ul id=\'ul"+i+"\'></ul>"
代码示例:通过append方式添加html页面的情况 for (var i in results) { var text = "<button class=\"label label-primary\" style=\"line-height:30px; margin: 8px; padding-left: 15px; padding-right: 15px;font-size: 16px;background-color: #337ab7\" class=\"label\" id=" + "postId_" + i + " >" + "<span class=\"label_name\">" + results[i] + " </span>" + "<span style=\"position: relative;top: -8px;left: 13px;font-size: 16px;\" class=\"delete\">" + "X" + "</span>" + "</button>"; $("#label_content").append(text); }
七、Corpus项目部署上线
yufeng账号
1.lsof -i:5050 #查看5050端口的进程号 2.kill 进程号 #随意删除一个进程号 3.cd workpace/corpus/corpus git pull #在项目目录下拉取git提交的项目 4.sh startup.sh #脚本重启项目(就是切换环境和启动项目) 5.页面查看是否能正常访问
corpus服务器重新部署项目
1.git clone xxx.git #这个是将master分支的代码clone下来,需要master分支是最新的代码 2.建立环境 python -m venv venv #在base环境下创建,进入项目创建,比如这个需要进corpus 3.激活环境 . venv/bin/activate #激活环境的同时就进去环境 4.安装环境目录 pip install 模块 5.安装服务器模块 pip install gunicorn 6.启动项目 gunicorn -b 127.0.0.1:5050 "flaskr:create_app('production')" #不用-D,代表守护进程 7.安装项目缺少的logs和instance文件夹 log查看错误,到logs文件下:tail log