1.先引入js和css
<head>
<link rel="stylesheet" type="text/css" href="./css/mobileSelect.css">
<script src="./js/mobileSelect.min.js" type="text/javascript"></script>
</head>
2.在页面定义一个容器，我这边选择用input，id='trigger’不可缺少
<input type="text" id="trigger" placeholder="请选择企业" readonly class='inputs'>
3.声明
<script type="text/javascript">
let arr = []
let indexArrs = 0
const mobileSelect1 = new MobileSelect({
trigger: '#trigger',
title: '请选择企业',
wheels: [
// 初始值，由于我这边是ajax异步的，所以没有设置初始值，但是data不能为空数组
{data:['']}
],
position:[0], //初始化定位
callback:function(indexArr, data){
// data为选中的值，由于我是input，所以用js给input赋值
document.getElementById('trigger').value = data[0]
// 索引值，indexArr，不过是一个数组
indexArrs = indexArr[0]
}
})
// 如需使用show可以
function isShow () {
mobileSelect1.show()
}
4.ajax异步赋值
// 这一步仅需看mobileSelect1.updateWheel(0, name)
ajax({
url : sedURL + "/SQOpenAPI/appGetUrlController/selectAppGetUrlList", // url---->地址
type : "POST", // type ---> 请求方式
async : true, // async----> 同步：false，异步：true
data : { //传入信息
body: {
userName: inputs[0].value
}
},
success : function(ret){ //返回接受信息
let result = JSON.parse(ret)
const {body: {code, data}} = result
if (+code === 0) {
if (data.length === 1) {
getBind(data[0].url, data[0].orgName)
} else if(data.length > 1) {
document.getElementById('show').style.display = 'inline'
arr = []
let name = []
data.map(v =>{
arr.push({
value: v.orgName,
url: v.url
})
name.push(v.orgName)
})
// 获取到值，异步赋值，name是一个猪猪
mobileSelect1.updateWheel(0, name)
}
} else {
alert(result.body.info)
}
}
})
776
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
