引用: <link href="css/mobileSelect.css" rel="stylesheet" />和<script src="js/mobileSelect.js"></script>
html
<dl>
<dd class="MyFun">名称</dd>
<dd class="leftFun card" id="dsgName"><input type="text"readonly placeholder="去设置" /></dd>
</dl>
<dl>
<dd class="MyFun">值班时段</dd>
<dd class="leftFun card" id="dsgDot"><input type="text"readonly placeholder="去设置" /></dd>
</dl>
jq
固定数值
var starTime = ['9:00', '9:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00', '18:30', '19:00', '19:30', '20:00', '20:30', '21:00', '21:30', '22:00', '22:30', '23:00', '23:30', '24:00'];
var endTime = ['9:00', '9:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00', '18:30', '19:00', '19:30', '20:00', '20:30', '21:00', '21:30', '22:00', '22:30', '23:00', '23:30', '24:00'];
var mobileSelect = new MobileSelect({
trigger: '#dsgDot',
title: '值班时段',
wheels: [
{ data: starTime },
{ data: endTime },
],
callback: function (indexArr, data) {
//选中完成执行的方法
}
position: [0, 1], //定位
});
C#
JavaScriptSerializer jss = new JavaScriptSerializer();
HttpContext context = null;
string sResult = "";
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
this.context = context;
string type = context.Request.Form["itype"];
switch (type)
{
case "Table":
sResult = Table();
break;
}
context.Response.Write(sResult);
}
private string Table()
{
//查询所有的list
List<Model.Super.Table> zw = TableDAL.m_TableDal.GetList(" 1=1");
return jss.Serialize(zw);
}
AJAX
$.post("url", { "itype": "data" }, function (data) {
var d = JSON.parse(data);
var dotPosition = [];
for (var i = 0; i < d.length; i++) {
dotPosition[i] = d[i].name;
}
var mobileSelect3 = new MobileSelect({
trigger: '#dsgName',
title: '名称',
wheels: [
{ data: dotPosition}
],
callback: function (indexArr, data) {
var dotPositionIndex = indexArr[0];
}
});
});
注意:如需和后端数据交互,需要标准的json的数据格式 其格式为
[{
"id": 1,
"value": "value1"
},
{
"id": 2,
"value": "value2"
},
{
"id": 3,
"value": "value3"
}
************************
]