如何通过JS实现三级分类联动并获取长尾关键词？

2026-04-06 19:511阅读0评论SEO资讯

内容介绍
文章标签
相关推荐

本文共计551个文字，预计阅读时间需要3分钟。

动态三级联动查询一级分类列表，不使用jQuery，不超过100字。

javascript动态三级联动查询一级分类列表

动态三级联动

// 查询到一级分类列表 applySingleClass(0,0, oneClick) var oneClick = function(){ // 手动选中某个选项 var oneID = ids[0].split("-")[1] eval('$("#classOne").find("option[value= '+oneID+' ]").attr("selected", true)') // 手动触发select的change事件 eval('$(".classOne").find("option[value= '+oneID+' ]").attr("selected", true)') // 如果有二级分类信息继续请求列表 if(ids[2]){ // 请求二级分类列表 applySingleClass(oneID,1, twoClick) var twoClick = function(){ // 手动选择某个二级分类选项 var twoID = ids[2].split("-")[1] eval('$("#classTwo").find("option[value= '+twoID+' ]").attr("selected", true)') eval('$(".classTwo").find("option[value= '+twoID+' ]").attr("selected", true)') // 如果有三级分类信息继续请求三级列表 if(ids[4]){ // 请求三级分类列表 applySingleClass(twoID, 2, threeClick) var threeClick = function(){ // 手动选择某个三级分类 var threeID = ids[4].split("-")[1] eval('$("#classThree").find("option[value= '+threeID+' ]").attr("selected", true)') eval('$(".classThree").find("option[value= '+threeID+' ]").attr("selected", true)') } } } } } //单个分类中，三级分类初始化 function applySingleClass(num, type, cb) { /** * num 查询分类ID * type 查询分级 0：一级分类 1：二级分类 2：查询三级分类 * cb 回调 */ $.ajax({ url:'/cms/queryGoodsClass', type:'post', data:{ parentId: num }, success:function(data){ if(data.code === 1){ var shipTpl = '' if (data.data.body) { data.data.body.forEach(function (v) { shipTpl += ' '; }) } if(type === 0){ // 如果是请求一级分类信息就将下拉项添加到select上 $(".classOne").html(''+shipTpl) }else if(type === 1){ // 如果是请求二级分类信息就将下拉项添加到select上 $(".classTwo").html('' + shipTpl) }else if(type === 2){ // 如果是请求三级分类信息就将下拉项添加到select上 $(".classThree").html('' + shipTpl) } cb && cb() //处理回调 } }, error: function(err){ console.log("error",err) } }); }

标签：联动获取动态三级查询