iosselect
Version:
iosselect for andriod and ios
61 lines (59 loc) • 2.52 kB
HTML
<head>
<title>三国杀</title>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<link rel="stylesheet" href="../../src/iosSelect.css">
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "//hm.baidu.com/hm.js?b25bf95dd99f58452db28b1e99a1a46f";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
</head>
<body>
<a href="https://github.com/zhoushengmufc/iosselect">查看文档</a>
<div class="form-item item-line">
<label>选择选将组合</label>
<div class="pc-box">
<input type="hidden" name="su_id" id="suId" value="">
<input type="hidden" name="wei_id" id="weiId" value="">
<span id="showGeneral">点击这里选择将领</span>
</div>
</div>
</body>
<script src="data.js"></script>
<script src="../../src/iosSelect.js"></script>
<script type="text/javascript">
var showGeneralDom = document.querySelector('#showGeneral');
var suIdDom = document.querySelector('#suId');
var weiIdDom = document.querySelector('#weiId');
showGeneralDom.addEventListener('click', function () {
var suId = showGeneralDom.dataset['su_id'];
var suValue = showGeneralDom.dataset['su_value'];
var weiId = showGeneralDom.dataset['wei_id'];
var weiValue = showGeneralDom.dataset['wei_value'];
var sanguoSelect = new IosSelect(2,
[suData, weiData],
{
title: '将领选择',
itemHeight: 35,
oneLevelId: suId,
twoLevelId: weiId,
callback: function (selectOneObj, selectTwoObj) {
suIdDom.value = selectOneObj.id;
weiIdDom.value = selectTwoObj.id;
showGeneralDom.innerHTML = '蜀国将领是：' + selectOneObj.value + ' 魏国将领是：' + selectTwoObj.value;
showGeneralDom.dataset['su_id'] = selectOneObj.id;
showGeneralDom.dataset['su_value'] = selectOneObj.value;
showGeneralDom.dataset['wei_id'] = selectTwoObj.id;
showGeneralDom.dataset['wei_value'] = selectTwoObj.value;
}
});
});
</script>
</body>
</html>