jQueryWEUI使用picker实现二级联动
时间:2022-07-24
本文章向大家介绍jQueryWEUI使用picker实现二级联动,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
项目需求根据不同的日期选择不同的时间段实现二级联动 日期的返回数据
时间段的返回数据
<input type="text" placeholder="请选择日期" id='date'>
<div id='eloct'>
<input type="text" placeholder="请选择时段">
</div>
//获取日期信息
$.ajax({
url: url,
type: "post",
data: { key: key, type: 'getFlashSignInfo' },
dataType: 'json',
success: function (res) {
if (res.status == 1) {
for (let i = 0; i < res.data.date.length; i++) {
$("#date").picker({
title: "请选择日期",
cols: [{
textAlign: 'center',
values: res.data.date
}],
//点击完成或关闭picker获取时间段信息
onClose: function (picker) {
console.log(picker)
dataTime(picker.value[0])
},
});
}
} else {
$.toptip(res.msg, 'error');
}
}
})
//获取时间段
function dataTime(appDate) {
$.ajax({
url: url,
type: "post",
data: {
key: key,
type: 'getFlashTimeInfo',
data: { 'appDate': appDate },
},
dataType: 'json',
success: function (res) {
if (res.status == 1) {
list = []
for (let i = 0; i < res.data.length; i++) {
list.push(res.data[i].app_time);
}
$("#eloct").html(`<input type="text" placeholder="请选择时段" id='period'/>`)
$("#period").picker({
title: "请选择时段",
cols: [{
textAlign: 'center',
values: list
}],
});
}
}
})
}
- WCF后续之旅(3): WCF Service Mode Layer 的中枢—Dispatcher
- silverlight 2 Random 随机数解决方案
- 开发中巧用Enum枚举类型
- Jquery 事件冒泡
- Vue2的单元测试与调试技术
- silverlight beta 2 将在本周末发布.
- [Silverlight 4 RC]WebBrowser概览
- 英文域名chosen.com超22万元易主
- 简单介绍Docker的架构特性与局限
- .NET4.0下网站应用程序用UrlRewriter.dll重写无后缀路径 (在IIS7.5中的配置方法)
- 微信搜索新发现:iPhone 内存不足看这里!
- 建立可扩展的silverlight 应用框架 step-6
- .NET4.0下网站应用程序用UrlRewriter.dll重写无后缀路径 (在IIS7.5中的配置方法)
- 苹果为你的心跳开发一个读者
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 跟牛老师一起学WEBGIS——WEBGIS基础(WMS服务)
- 【STM32H7】第6章 RL-TCPnet V7.X底层驱动说明
- 【STM32F429】第6章 RL-TCPnet V7.X底层驱动说明
- 【STM32F407】第6章 RL-TCPnet V7.X底层驱动说明
- LINUX一些面试问题集合
- 【redis6.0.6】redis源码慢慢学,慢慢看 -- 第二天:空间配置(zmalloc)
- URI格式
- 讲通C/C++预编译/条件编译指令 #ifdef,#ifndef,#endif,#define,…
- FreeRTOS静态和动态创建任务
- Jenkins部署Springboot项目
- atoi函数
- 网络字节
- redis学习(五)
- 编译报错原因
- 【Pod Terminating原因追踪系列之三】让docker事件处理罢工的cancel状态码