layui爬坑--为什么第二次if条件判断的时候得到的值一直是undifined？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>按钮控制tab并跳转</title>
<link rel="stylesheet" href="layui/css/layui.css">
</head>
<body>
<div class="layui-tab" lay-filter="demo" lay-allowclose="true" >
<ul class="layui-tab-title" id="navlink">
<li class="layui-this" lay-id="11">网站设置</li>
<li lay-id="22">用户管理</li>
<li lay-id="33">权限分配</li>
<li lay-id="44">商品管理</li>
<li lay-id="55">订单管理</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">内容1</div>
<div class="layui-tab-item">内容2</div>
<div class="layui-tab-item">内容3</div>
<div class="layui-tab-item">内容4</div>
<div class="layui-tab-item">内容5</div>
</div>
</div>
<ul class="layui-nav layui-nav-tree layui-inline" lay-filter="adddemo" style="margin-right: 10px;">
<li class="layui-nav-item layui-nav-itemed">
<a href="javascript:;">默认展开</a>
<dl class="layui-nav-child">
<dd>
<a href="javascript:;" >选项一</a>
</dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;" >社区</a>
</li>
<li class="layui-nav-item">
<a href="javascript:;" >111区</a>
</li>
<li class="layui-nav-item">
<a href="javascript:;" >333区</a>
</li>
</ul>
<script src="layui/layui.js"></script>
<script>
layui.use('element', function(){
var $ = layui.jquery
,element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块
var tabUrl=[
{
"title": "333区",
"src": "html/change-user.html",
"pid":000
},
{
"title": "社区",
"src": "html/add-user.html",
"pid":111
},
{
"title": "111区",
"src": "html/bill.html",
"pid":222
},{
"title": "选项一",
"src": "html/lanmu.html",
"pid":333
}
] ;
//地址 hash的匹配
var layid = location.hash.replace(/^#demo=/, '');
element.tabChange('demo', layid);
element.on('tab(demo)', function(elem){
location.hash = $(this).attr('lay-id');
});
element.on('nav(adddemo)', function(elem){
var othis = $(this);
//console.log(othis.context.innerText); //得到当前点击的DOM对象
//console.log(elem);
var ul_li=$('#navlink li');
var mun=false;
//var this_title=othis.context.innerText;
for(var i=0;i<ul_li.length;i++){
(function(org){
if(othis.context.innerText==ul_li[i].getAttribute('lay-id')){
element.tabChange('demo', othis.context.innerText);
return mun=true;
}else if(org+1== ul_li.length && mun==false){
addtab();
}
})(i);
function addtab (){
var tabUrl_this_src;
for(var j=0;j<tabUrl.length;j++){
console.log(tabUrl[j].title+' + '+othis.context.innerText);
if( tabUrl[j].title==othis.context.innerText ){
tabUrl_this_src=tabUrl[j].src;
console.log(tabUrl_this_src);
}
}
element.tabAdd('demo', {
title: othis.context.innerText //选项卡的标题
,content: '<iframe src="'+tabUrl_this_src+'" class="larry-iframe" name="ifr_0" frameborder="0" id="iframepage" width="100%" height="100%" > </iframe>'
,id: othis.context.innerText //选项卡标题的lay-id属性值
});
element.tabChange('demo', othis.context.innerText);
console.log("333 -"+tabUrl_this_src);
}
}
});
});
</script>
</body>
</html>
qq_琥珀的眼泪_00回答
随时随地看视频慕课网APP
Html/CSS
JavaScript