目录
目录
1.收藏与取消收藏切换
说明:从接口中获取收藏状态,单击切换状态,如下图所示:
开始状态:
点击后状态:
代码实现:
1、全局定义一个变量,记录状态:var collect_flag = false;
2、获取接口中的字段状态:collect_flag = head.is_collect;//head.is_collect为接口中返回的字段
3、页面展示:(由于开发中都是使用append添加上的,所以定义了变量a,然后添加到节点)
if(head.is_collect ==false){
a+=`<img class ="collect_img" src="../static/image/icon/shoucang.png"/>
<span class = "collect_text">收藏</span> `
}else{
a+=`<img class ="collect_img" src="../static/image/icon/shoucang_select.png"/>
<span class = "collect_text">取消收藏</span> `
}
代码截图:
4、 添加点击事件:
//操作收藏/取消收藏
function collect(tender_unid){
if(collect_flag){
$(".collect_img").attr("src","../static/image/icon/shoucang.png");
$(".collect_text").text("收藏");
}else{
$(".collect_img").attr("src","../static/image/icon/shoucang_select.png");
$(".collect_text").text("取消收藏");
}
collect_flag = !collect_flag;
//之后调用接口,将相应值传过去即可
}
2.使用layui插件下拉选择渲染问题(第二次下拉仍是第一次的值)
说明:jq开发使用的是layui插件,使用layui.dropdown做联动的时候,第二次下拉显示的值仍是第一次的,如下:
选择一级工程荣誉-二级国家级-三级下拉荣誉类别如上, 如改变一级,二级,三级荣誉类别数据仍是上边,源部分代码如下(只截取部分代码示例):
修改后代码如下:
经测试实现了想要的效果。