详细问题描述
最近在用开源项目灰狐修改成商城app,本意是想加入购物车成功后,弹出一个菜单选择立即结算还是留在本页,发现如下问题,由于只有两个选项,暂时改成确认框将就一下。
监听a元素tap事件进行ajax请求,返回后js调用显示popover层,遮屏后不显示内容;
添加一个用描点显示该popover层的<a>元素测试正常;
代码如下:
<footer class="mui-bar mui-bar-tab">
<a class="mui-btn mui-btn-primary mui-pull-right" id='cart'>
加入购物车
</a>
<a href="#popover" class="mui-btn mui-btn-red mui-pull-right" id="buy">
立即购买
</a>
</footer>
点击“立即购买”能正常显示弹出层popover,点击 加入购物车,后只遮住屏幕,不弹出内容;
多次测试发现,先点击“立即购买”弹出popover层,点击空白处隐藏弹出层后再点击加入购物车能弹出popover层,但是位置是在原来的位置,即点 立即购买 显示的位置,不是在加入购物车的位置。
popover代码,mui文档中直接复制过来的;
<div id="popover" class="mui-popover">
<ul class="mui-table-view">
<li class="mui-table-view-cell"><a href="#">Item1</a></li>
<li class="mui-table-view-cell"><a href="#">Item2</a></li>
<li class="mui-table-view-cell"><a href="#">Item3</a></li>
<li class="mui-table-view-cell"><a href="#">Item4</a></li>
<li class="mui-table-view-cell"><a href="#">Item5</a></li>
</ul>
</div>
监听和返回js代码
var cart = document.getElementById('cart');
var needlogin = document.querySelector('.need-login');
cart.addEventListener('tap',function(){
logData(localStorage.getItem('user'));
//判断用户是否已经登录,已经登录就需要去获取购物车列表
if (localStorage.getItem('user')) {
//将登录按钮隐藏,并且去获取购物车列表或则更新购物车列表todo
needlogin.style.display = 'none';
var fs = document.querySelectorAll('.mui-content-padded');
var featureids = new Array();
console.log(fs);
for (var k=0;k<fs.length;++k) {
//var objft = new Object();
//objft.feature_id = fs[k].getAttribute('feature_id');
//objft.fv_id = fs[k].getAttribute('fv_id');
featureids.push(fs[k].getAttribute('selected_id'));
}
var user = JSON.parse(localStorage.getItem('user'));
ajax_add_cart({
product_id:product_id,
feature_values:featureids,
supplier_id:detail.supplier.supplier_id,
category_id:detail.categoryID,
user_id:user.website_id,
num:2
});
}else {
//如果退出登录或者没有登录成功这个div将被显示出来。
needlogin.style.display = 'block';
}
},false);
});
//加入购物车返回函数
function addCartSuccess(data)
{
//console.log(JSON.stringify(data));
plus.ui.alert(data.msg);
//传入toggle参数,用户也无需关心当前是显示还是隐藏状态,mui会自动识别处理;
mui('.mui-popover').popover('show');
}
联系方式
[QQ]1635809151
[电话]
0 个回复