js中写的超级链接在web模式时可以跳转,但切换到手机端偶尔能点击到a标签

木兮沐阳 2020-11-30 06:36:26
//获取章节信息
function chapter_info() {
var couId = $("body").attr("couId");
// console.log(cou);
$.get("/home/getChapterinfo", {couid: couId}, function (data) {
var d = eval("(" + data + ")");
// console.log(d);
isStudy = d.isStudy;
//构造树形数据结构
if (d.chapter.length > 1) {
for (var i =0;i< d.chapter.length; i++) {
var olisnode = d.chapter[i].olIsnode,olQuescount = d.chapter[i].olQuescount,olisfinish=d.chapter[i].olIsfinish;


if (olisnode) {
if(isFirstNode) {
isFirstNode = false;
} else {
listData += ']\n},'
}
listData += "{\n\"name\": \"" + d.chapter[i].olName + "\",\n";
listData += "\"olQuescount\":\"" +olQuescount+ "\",\n" + "\"olisfinish\":\"" +olisfinish+ "\",\n";
listData += "\"url\": \"" + "QuesExercises.th?olid=" + d.chapter[i].olId + "&couid=" + couId + "\",\n";

listData += "\"lists\":["
} else {
listData += "{\n\"name\": \"" + d.chapter[i].olName + "\",\n";
listData += "\"olQuescount\":\"" +olQuescount+ "\",\n" + "\"olisfinish\":\"" +olisfinish+ "\",\n";
listData += "\"url\": \"" + "QuesExercises.th?olid="+d.chapter[i].olId+"&couid="+couId+"\",\n},\n";

}
}
listData += "]}]"
}else{}
createTree();

})
}

//创建章节树列表
function createList(listData) {
const list = document.createElement('ul');
for(const data of listData) {
const li = document.createElement('li');
const a = document.createElement('a');
const s = document.createElement('span');

if(data.olisfinish == "false")
{
a.innerText = data.name;
// a.setAttribute('type', 'nofinish');
// a.setAttribute('class', 'noselect');

s.setAttribute('class', 'mui-badge');
s.innerText = '未完结';
li.appendChild(s);

}else if(isStudy == "true" || couIsfree || couIslimitfree || couIstry) {
a.innerText = data.name;
a.setAttribute('href', data.url);

const s1 = document.createElement('span');
s1.setAttribute('class', 'mui-badge count');
li.appendChild(s1);

s.innerText = 0;
s.setAttribute('class', 'ansnum');
s1.appendChild(s);

const s2 = document.createElement('span');
s2.innerText ='/' + data.olQuescount;
s2.setAttribute('class', 'num');

s1.appendChild(s2);
}
else {
//a.setAttribute('type', "buy");
data.url = "CourseBuy.th?couid=" + $().getPara("couid");
a.setAttribute('href', data.url);
a.innerText = data.name;

s.setAttribute('class', 'mui-badge');
s.innerText = '购买';
li.appendChild(s);
}

li.appendChild(a);

let hasChild=false;
if(data.lists) {
hasChild=true;
li.appendChild(createList(data.lists));
}
li.setAttribute('class', 'chapter' + (!hasChild ? '-cell' : ''));
li.setAttribute('count',data.olQuescount);
list.appendChild(li);
}
return list;
}
//章节树的点击事件
function createTree(){
document.getElementById("Chapters").appendChild(createList(eval(listData)));
//querySelectorAll会查找元素内部匹配条件的所有元素,而querySelector只会查找元素内部第一个匹配条件的元素
document.querySelectorAll('.chapter', '::before').forEach(node => {
node.onclick = (event)=> {
//event.target指的是触发事件的元素源,localName用来获取触发事件元素的标签
console.log(event.target.localName);
switch(event.target.localName) {
case "ul":
const ulnode = node.querySelector('ul');
// console.log(ulnode);
//setAttribute用来设置元素的属性,而display是style对象内的属性
ulnode.style.display = (ulnode.style.display == "" ? "none" : "");
break;
case "li":
const ul = node.querySelector('ul');
// console.log(ul);
//setAttribute用来设置元素的属性,而display是style对象内的属性
ul.style.display = (ul.style.display == "" ? "none" : "");
break;
case "a":

//preventDefault方法用来阻止元素发生默认的行为(点击a标签默认会转向锚点链接)
// event.preventDefault();
// console.log(event.view.location.href);
//return;
break;
}
//由于事件会逐层向上传递(事件冒泡),因此必须调用该方法阻止事件继续传播
event.stopPropagation();
}
});
}
...全文
14104 2 打赏 收藏 转发到动态 举报
写回复
用AI写文章
2 条回复
切换为时间正序
请发表友善的回复…
发表回复
木兮沐阳 2020-12-06
  • 打赏
  • 举报
回复
谢谢,重新写了a标签的处理函数 //处理点击a标签 var href=document.getElementsByTagName('a'); for(var i=0;i<href.length;i++){ href[i].ontouchend=function(){ window.location.href=this.getAttribute("href"); } };
亦夜 2020-12-01
  • 打赏
  • 举报
回复
你是用的mui吗? https://blog.csdn.net/qq_38177305/article/details/78713267 不是的话,用事件控制吧 https://blog.csdn.net/weixin_39675478/article/details/87292630

87,987

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧