<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>在首页显示</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="../../css/mui.min.css">
<link rel="stylesheet" href="../../css/iconfont.css">
<link rel="stylesheet" href="../../css/style.css">
<style>
.iconfont {
color: #47A400;
font-size: 20px;
}
.mui-table-view {
margin-top: 15px;
margin-bottom: 15px;
display: none;
}
</style>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<button id="save" class="mui-btn mui-btn-link mui-btn-nav mui-pull-right">
保存
<span class="mui-icon mui-icon-right-nav"></span>
</button>
<h1 class="mui-title">在首页显示</h1>
</header>
<div class="mui-content">
<ul class="mui-table-view" id="data-list">
</ul>
</div>
</body>
<script src="../../js/mui.min.js"></script>
<script src="../../js/jquery-1.10.2.min.js"></script>
<script src="../../js/jquery.lazyload.min.js"></script>
<script src="../../js/data.js"></script>
<script src="../../js/signin.js"></script>
<script src="../../js/app.js"></script>
<script>
mui.init({});
function loadService() {
mui.getJSON(server + '/m/wuye/service/load', {'uid': UserInfo.uid()}, function (data) {
if (data.success) {
plus.nativeUI.closeWaiting();
var obj = data.serviceList;
var html = '';
var ele = $("#data-list");
ele.css('display', 'block');
for (var i = 0; i < data.serviceList.length; i++) {
html += '<li class="mui-table-view-cell">' +
'<span class="mui-icon iconfont ' + obj[i].icon + '"></span>' + obj[i].name +
'<div class="mui-switch mui-active">' +
'<div class="mui-switch-handle"></div>' +
'</div>' +
'</li>';
}
console.log(html);
ele.html(html);
}
});
}
// mui('.mui-content .mui-switch').each(function () { //循环所有toggle
// //toggle.classList.contains('mui-active') 可识别该toggle的开关状态
// this.parentNode.querySelector('span').innerText = '状态：' + (this.classList.contains('mui-active') ? 'true' : 'false');
// /**
// * toggle 事件监听
// */
// this.addEventListener('toggle', function (event) {
// //event.detail.isActive 可直接获取当前状态
// this.parentNode.querySelector('span').innerText = '状态：' + (event.detail.isActive ? 'true' : 'false');
// });
// });
function plusReady() {
plus.nativeUI.showWaiting("等待中...");
loadService();
}
if (window.plus) {
plusReady()
} else {
document.addEventListener('plusready', plusReady, false)
}
</script>
</html>
yangyang
- 发布：2015-05-15 18:24
- 更新：2018-10-22 10:04
- 阅读：6154
最佳回复
老师您好，这是我在js里面写的代码： var li='<span >系统消息</span>'
+'<div class="mui-switch" id="s">'
+'<div class="mui-switch-handle"></div>'
+'</div>';
$("#xt").append(li);>
在页面上显示的按钮，点击没反应，不知是什么原因？
html里面的代码是： <div class="mui-content">
<ul class="mui-table-view" >
<li class="mui-table-view-cell" id="xt">
<span >系统消息</span>
<div class="mui-switch " >
<div class="mui-switch-handle"></div>
</div>
</li>
<li class="mui-table-view-cell" id="gr">
<!--<span>个人消息</span>
<div class="mui-switch mui-active" >
<div class="mui-switch-handle"></div>
</div>
-->
</li>
</ul>
</div>
能不能帮我看一下是什么问题？谢谢！
盘龍
有个疑问，希望得到解惑，谢谢！
mui('.mui-content .mui-switch')['switch']的这里['switch']可以解析一下吗？
mui('.mui-content .mui-switch')的数据类型应该是数组，那为什么里面会有switch呢？
是mui()这个方法中附带的吗？
2015-07-21 14:08
盘龍
回复 盘龍:嗯，明白了。类似于JQUERY（$），这个里面也是带有JQUERY的上下文的！如果我理解错误，请指出，谢谢！
2015-07-21 14:09
binbin
请问 mui('.mui-content .mui-switch')['switch'](); 加在哪里
2016-08-28 10:43