{{{
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<a class="mui-action-menu mui-icon mui-icon-gear mui-pull-right" id="popbtn"></a>
<h1 class="mui-title" id="h_title">谁的空间</h1>
</header>
<nav class="mui-bar mui-bar-tab">
<a class="mui-tab-item">
<span class="mui-icon mui-icon-chatbubble"></span> 聊天
</a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-personadd" style="line-height: 20px;"></span> 关注
</a>
</nav>
<div class="mui-content">
<div id="popover" class="mui-popover">
<ul class="mui-table-view">
<li class="mui-table-view-cell"><a href="#">拉黑</a>
</li>
<li class="mui-table-view-cell"><a href="#">打招呼</a>
</li>
<li class="mui-table-view-cell"><a href="#">送礼物</a>
</li>
</ul>
</div>
<div id="slider" class="mui-slider">
<div class="mui-slider-group ">
<div class="mui-slider-item mui-slider-item-duplicate">
<a href="#">
<img src="../images/user_detail.jpg">
</a>
<button id="renqibtn" class="mui-btn mui-btn-positive user_detail_renqi">人气 <span class="mui-badge mui-badge-positive">1</span>
</button>
<img src="../images/1.jpg" style="position: absolute;bottom: 0px;left: 20px;width: 80px;height: 80px;border-radius: 40px; z-index:999 ;" />
</div>
</div>
</div>
<div style="padding: 10px 10px;">
<div id="segmentedControl" class="mui-segmented-control">
<a class="mui-control-item mui-active" href="#item1mobile">
基本资料
</a>
<a class="mui-control-item" href="#item2mobile">
详细资料
</a>
<a class="mui-control-item" href="#item3mobile">
个人相册
</a>
<a class="mui-control-item" href="#item3mobile">
心情日记
</a>
</div>
</div>
<div id="popover" class="mui-popover">
<ul class="mui-table-view">
<li class="mui-table-view-cell"><a href="#">加入黑名单</a>
</li>
<li class="mui-table-view-cell"><a href="#">给他写信</a>
</li>
<li class="mui-table-view-cell"><a href="#">Item3</a>
</li>
<li class="mui-table-view-cell"><a href="#">Item4</a>
</li>
</ul>
</div>
<div class="mui-card">
<ul class="mui-table-view" id="zd_ul">
<li class="mui-table-view-cell mui-collapse"><a class="mui-navigate-right" href="#"><span class="mui-icon mui-icon-forward"></span>内心独白</a>
<div class="mui-collapse-content" id="con_1">
</div>
</li>
<li class="mui-table-view-cell mui-collapse"><a class="mui-navigate-right" href="#"><span class="mui-icon mui-icon-forward"></span>择友标准</a>
<div class="mui-collapse-content">
</div>
</li>
<li class="mui-table-view-cell mui-collapse"><a class="mui-navigate-right" href="#"><span class="mui-icon mui-icon-forward"></span>联系方式</a>
<div class="mui-collapse-content">
</div>
</li>
</ul>
</div>
</div>
</body>
<script type="text/javascript">
var flag = false;
var userid =null;
//获取从上个页面获取过来的参数
window.addEventListener('testId', function(event) {
// Wait = plus.nativeUI.showWaiting("新闻加载中");
userid = event.detail.id;
alert(userid);
var url = serverURL+'/user_detail.php?id='+userid;
var xhr = new plus.net.XMLHttpRequest();
xhr.onreadystatechange = function() {
switch (xhr.readyState) {
case 4:
if (xhr.status == 200) {
var jsondata = eval('(' + xhr.responseText + ')');
var carList = '';
carList += '<h1>'+jsondata[0].monolog+'</h1>';
document.getElementById('con_1').innerHTML='<h1>kk</h1>';
} else {
alert("xhr请求失败:" + xhr.readyState);
}
break;
}
}
xhr.open("GET", url);
xhr.send();
});
document.getElementById('renqibtn').addEventListener('tap', function() {
var parent = document.getElementById('renqibtn');
parent.className = parent.className + " turnon90";
}, false);
document.getElementById('popbtn').addEventListener('tap', function() {
if (!flag) {
mui('#popover').popover('show', {
left: 100,
right: 200
});
} else {
mui('#popover').popover('toggle');
}
//$('#popover').popover('toggle');//也可以直接调用toggle。该方法自动识别是显示还是隐藏
}, false);
/**
* 改变折叠菜单的样式
*/
mui('#zd_ul').on('tap','li',function(){
var ul= document.getElementById('zd_ul');
var chil=ul.children;
for (var i=0;i<chil.length;i++) {
chil[i].children[0].children[0].className='mui-icon mui-icon-forward';
}
var span = this.children[0].children[0];
span.className='mui-icon mui-icon-arrowdown';
});
/**
* 加载数据
*/
mui.plusReady(function(){
});
</script>
}}}