var date = new Date() var month = date.getMonth()+1 //获取当前月份 $('#selectTime').picker({ toolbarTemplate:'<div class="toolbar"><div class="toolbar-inner"><a href="javascript:;" class="picker-button close-pic…
前言 由于最近做的一个移动端项目需要使用到类似 WeUI Picker组件 的选择效果,  所以在这里来分析下 WeUI Picker 的实现逻辑.(weui.js项目地址) 之前也做过类似的组件, 是基于iscroll实现的.单列滑动的效果还可以.至于多列联动,数据结构整的太乱了, 不太好扩展. 1.项目结构 大家通过上面 weui.js 的项目地址去下载到本地, 打开之后找到 src 下面的 picker 就是我们今天要学习的 picker 组件的代码了. 其中picker.js 和 scr…
jQuery weui有个支持单选或者多选的select弹出层,默认他是这样的 第2部分选择什么值,第1部分就显示什么值,一般的场景支持是没问题了,但本次开发碰到了一个问题. 需求描述: 职业名称后面要显示一些描述,如“法官 2个案件在审理”,“医生 正在做手术”,同时要求点击对应项时,只显示“法官”,“医生”而不显示剩余的描述,根据select现有的逻辑是无法实现这个功能的.只能实现选项是什么,显示的值就是什么,不明白,看下图 解决方案: 查看官方文档,数据通过title和value进行控制,…
万年没更新了. 最近用jquery weui. 在使用picker时需要一些问题. 就是让picker 显示label, 但是取值的时候取value用于存储. 官网例子如下 Jquery-weui 官网 : 点这里  写这篇文章时,用的版本是1.2.1版本 $("#picker-name").picker({ title: "请选择您的称呼", cols: [ { textAlign: 'center', values: ['赵', '钱', '孙', '李', '…
//将日期输入框变为年月的函数方法    var month=0;      $('#effectiveDate').datebox({        onShowPanel: function () {//显示日趋选择对象后再触发弹出月份层的事件,初始化时没有生成月份层            span.trigger('click'); //触发click事件弹出月份层            if (!tds) setTimeout(function () {//延时触发获取月份对象,因为上面…
html: <input type="text" id="datetime" > js: <script type="text/javascript"> $(function() { $('#date').datebox({ onShowPanel : function() {// 显示日趋选择对象后再触发弹出月份层的事件,初始化时没有生成月份层 span.trigger('click'); // 触发click事件弹出月…
//对EditText注册OnTouch事件etSscxNssbDate.setOnTouchListener(selectDateTouchListener); //选择日期 private OnTouchListener selectDateTouchListener = new OnTouchListener(){ @Override public boolean onTouch(View v, MotionEvent event) { if(event.getAction()==Moti…
<style> *{margin: 0px; padding: 0px;} </style> <input type="text" name="year" onclick="Canlender.getYear($(this))" /> <input type="text" name="year" onclick="Canlender.getMonth($(…
etXyLevelDate.setOnTouchListener(selectDateTouchListener()); /** * @desc 选择日期操作 * @param @return * @return OnTouchListener * @throws */ OnTouchListener selectDateTouchListener(){ return new OnTouchListener() { @Override public boolean onTouch(View v,…
<script src="{% static "jquery/jquery-1.11.3.min.js" %}"></script> <script language="javascript" type="text/javascript" src="{% static 'bootstrap-datetimepicker/js/bootstrap-datetimepicker.js' %}…
  前言 上一篇博文<玩转控件:重绘ComboBox —— 让ComboBox多列显示>中,根据大家的回馈,ComboBox已经支持筛选了,更新见博文最后最后最后面.   奇葩 这两天遇到一个很“诡异”的情况,之前手机拦截短信一直用腾讯手机管家,这两天发神经,把腾讯手机管家卸载掉,换成360手机管家.然后一如既往的设置好闹钟,睡觉.. 结果尼玛一觉睡到自然醒!拿过手机一看11:35am,手机闹钟居然没响!我很希望今天是星期六,为此我还狠劲的捏了下我白里透红的小脸,却无法扭转今天星期五的窘境.…
jQuery WeUI jQuery WeUI 是专为微信公众账号开发而设计的一个简洁而强大的UI库,包含全部WeUI官方的CSS组件,并且额外提供了大量的拓展组件,丰富的组件库可以极大减少前端开发时间. jQuery WeUI 的最大特点是它只提供UI组件,并不会对项目所使用的框架和其他库有任何的限制,几乎可以在任何环境下使用.无论你的项目是基于jQuery,还是 React, Angular, Vue, 你都会发现 jQuery WeUI 能非常方便的和他们结合使用.既是你的项目是一个有很悠…
1.引入Jquery和easyui,注低版本的Jquery和easy不能使用,这里使用的Jquery是1.8.2easyui是1.6.1.1.easyui下载地址:http://www.jeasyui.net/download/ <script type="text/javascript" src="Scripts/jquery-1.8.2.min.js"></script> <link rel="stylesheet&quo…
标题问题的答案在OSChina中 http://www.oschina.net/question/2282354_224401?fromerr=lHJTcN89 我还是把这个记录下来 ================================================================= <input id="dlgReleaseTime" class="easyui-datebox"></input> $('#dl…
如图: 上图是jQuery weui的时间选择控件,红框处本来应该有个“取消”按钮的,可惜偏偏没有,当用户不想选择的时候就不好处理,虽然插件提供了点击其他区域关闭的功能,但过于隐晦,不容易发现,因此本文的目的就是把这个取消按钮加上. 直接上代码: 大概4016行下面添加一个取消配置项,4021行下面添加取消按钮DOM结构,如下 var defaults = { updateValuesOnMomentum: false, updateValuesOnTouchmove: true, rotate…
原来的代码如下: <view class="right">     <picker mode="date" value="{{material.arriveToDate}}" bindchange="changeDate2">         <input placeholder="请输入预计到货时间" name="arriveToDate" value=&…
antd3.0后的某个版本后终于支持了只选择年份的设置.当时2.x版本的时候还不支持只选择年份,我们项目中有这个只选择年份的需求,为了ui风格的一致,只好自己撸了一个. 如今真是普天同庆!…
主要包括 下拉刷新pullToRefresh downRefresh.html 主要的代码是$(document.body).pullToRefresh(); <div class="weui-pull-to-refresh__layer"> <div class='weui-pull-to-refresh__arrow'></div> <div class='weui-pull-to-refresh__preloader'></d…
在微信开发H5页面的时候,往往借助于WeUI或者Jquery WeUI等基础上进行界面效果的开发,由于本人喜欢在Asp.net的Web界面上使用JQuery,因此比较倾向于使用 jQuery WeUI,本篇随笔结合官方案例和自己的项目实际开发过程的经验总结,对在H5页面开发过程中设计到的界面控件进行逐一的分析和总结,以期能够给大家在H5页面开发过程中提供有用的参考. 1.资源参考 WeUI : https://github.com/Tencent/weui WeUI for work:WeUI…
easyui datebox控件,只显示年月,不显示年月日 需要的效果图如下: 具体的js代码: <script> $(function(){ intiMonthBox('costTime'); }); var intiMonthBox = function(id){ var db = $('#'+id); db.datebox({ onShowPanel: function () {//显示日趋选择对象后再触发弹出月份层的事件,初始化时没有生成月份层 span.trigger('click'…
http://www.oschina.net/news/71590/jquery-weui-v0-4-2 jQuery WeUI V0.4.2 发布了! jQuery WeUI 中使用的是官方WeUI的CSS代码,并提供了jQuery/Zepto版本的JS API实现.因为直接使用了官方的CSS,所以你不用担心跟官方版本的冲突.实际上 jQuery WeUI == WeUI + jQuery插件.轻量的特性使jQuery WeUI 可以很好的和VUE.React.Angular等JS框架结合使用…
在微信开发H5页面的时候,往往借助于WeUI或者Jquery WeUI等基础上进行界面效果的开发,由于本人喜欢在Asp.net的Web界面上使用JQuery,因此比较倾向于使用 jQuery WeUI,本篇随笔结合官方案例和自己的项目实际开发过程的经验总结,对在H5页面开发过程中设计到的界面控件进行逐一的分析和总结,以期能够给大家在H5页面开发过程中提供有用的参考. 本篇随笔继续上篇随笔<基于Jquery WeUI的微信开发H5页面控件的经验总结(1)>进行介绍其他部分的内容. 7)条码.二维…
前言 今天的主题是 Picker 组件的设计与实现,Picker 组件是 NutUI 的一个拾取器组件,它用于显示一系列的值集合,用户可以滚动选择集合中一项,也可以支持多个系列的值集合供用户分别选择.我们通过一张效果图,来看看组件具体实现了什么功能. 说到 NutUI, 可能有些人还不太了解,容我们先简单介绍一下.NutUI 是一套京东风格的移动端Vue组件库,开发和服务于移动 Web 界面的企业级前中后台产品.通过 NutUI,可以快速搭建出风格统一的页面,提升开发效率.目前已有 50+ 个组…
封装vant 日期组件实现可以选择年份 <template> <div class="yearMonMain"> <div class="label">{{ label }}</div> <div class="content" @click="onShowDatePicker"> {{ date }} <van-icon name="arrow-up…
HooDatePicker 介绍(introduction) ==================================================项目需要一个DatePicker,只显示年月,而且选中的时间高亮显示(苹果默认的只显示灰色),研究多个代码后没有达到预想效果,没办法只能动手丰衣足食,用了一天时间封装出这个性能比较高的自定义DatePicker.苹果原生的UIDatePicker无法实现只提供年月选择,而HooDatePicker增加了年月显示,并提供了扁平化和样式美化…
在开发APP的过程中,我们可能会遇上软件中需要有很多下拉选择样式,就像之前我做的那个<房贷计算器>一样,有很多下拉选择,如果没有将Picker封装起来共用是很麻烦的. 安装插件 在React Native里这个组件叫Picker,目前(React Native0.25.1版本)来说,自带的Picker并不能很好的适应iOS和Android,所以在此借助第三方的插件:react-native-picker 安装插件命令:npm install --save react-native-picker…
英文原文:http://blog.garstasio.com/you-dont-need-jquery/selectors/愚人码头注: 原作者的写这文章的意图是让我们抛弃jQuery,You Don’t Need jQuery!提倡我们使用原生的JavaScript,所以收集整理了jQuery语法对应的DOM API : 原作者参数的原因可以看这里:http://blog.garstasio.com/you-dont-need-jquery/why-not/ ,个人同意他的观点,简单的页面或应…
一.前言: 我发现很多的同学都在抱怨说微信小程序的picker的mode = selector/mode = multiSelector 无法实现Object Array数据类型的绑定,其实很多人就想要和html中的下拉选中的通过选中获取vaule中的属性值,其实认真查看微信picker组件详解的都知道其实是可以实现的,只不过微信给的实例是array的实例而object array实例是留给大家去动手的哟,在这里我主要介绍的mode=selector 的objectArray实现. 二.介绍:…
公司上一期项目中新增了省市区滑动三级联动效果,用的是mint-ui的picker组件和popup组件,效果如下:点击确定换地区,点击取消不变 省市区数据是后台给的(根据上一级的id,获取下一级数据列表,省列表传0),数据格式如下 接下来就直接上代码了 引入组件后的html部分 <mt-pop v-model="popupVisible" position="bottom" class="prop-tk"> <div class=…
easyui datebox 只选择月份的方法 效果如下图: 代码如下: <html > <head> <meta charset="utf-8"> <title>ECharts · Example</title> <link href="../easyui/themes/default/easyui.css" rel="stylesheet" type="text/cs…