jQuery Mobile Slider Widget 使用js控制
2024-08-31 00:16:26
jQuery Mobile 滑动条控件
基本用法不用多说了,看这里:
http://www.runoob.com/jquerymobile/jquerymobile-form-sliders.html
创建方法还是很简单的,runnoob里面还特地给出了四种不同的滑动条样式。
但是,唯独少了一种效果,就是去除旁边的输入框 (input 类型为number)。
一开始我用的方法是css修改法:
#slider{display:none;float:left}
这里的#slider是你创建的Slider Widget 的id。
隐藏完后再设置滑动条 .ui-slider-track 的css。
(主要是修改margin、pading之类的,这个打开chrome,按下F12对着改就好)。
后来发现不用这么麻烦,给它添加个 class="ui-hidden-accessible" 就能完美隐藏了。
还有就是用js代码控制它:
设置value的值
$("#slider").val(80).slider("refresh");
设置Min、Max的值
$("#slider").prop("min", 1).slider("refresh");
$("#slider").prop("max", 100).slider("refresh");
监听改变:
$(document).ready(function(){
$( "#slider" ).on( 'slidestop', function( event ) {
var slider_value = $("#slider").val();
alert (slider_value);
});
});
最新文章
- 前端自动化测试 —— TDD环境配置(React+TypeScript)
- mysql触发器,答题记录表同步教学跟踪(用户列表)
- IOS本地通知
- Javascript 图片左右滑动与切换
- windows下bat批处理实现守护进程(有日志)
- 旧版本mysql下载大全,爽~~
- archive log
- js 数组切换图片
- 启动activity与使用Intent通信机制解析
- mybatis代码生成器
- SpringIOC的概念理解、构造器注入、setter注入、p命名空间注入、IOC容器介绍与比较
- Android 自定义AlertDialog的实现
- Problem D: 平面上的点——Point类 (IV)
- poj 1523Tarjan算法的含义——求取割点可以分出的连通分量的个数
- Web4个实验题目DOM+JS
- ShareRepository
- 我从Linux走来,选择了Windows
- 【SSH网上商城项目实战08】查询和删除商品类别功能的实现
- 报Cannot find /usr/local/tomcat/bin/setclasspath.sh错误
- Raspberry U盘操作