JS-日期框、下拉框、全选复选框
<!-- 下拉框 -->
<link rel="stylesheet" href="static/ace/css/chosen.css" />
<!-- 日期框 -->
<link rel="stylesheet" href="static/ace/css/datepicker.css" />
<!-- 日期框 -->
<script src="static/ace/js/date-time/bootstrap-datepicker.js"></script>
<!--提示框-->
<script type="text/javascript" src="static/js/jquery.tips.js"></script>
$(function() {
//日期框
$('.date-picker').datepicker({
autoclose: true,
todayHighlight: true
});
//下拉框
if(!ace.vars['touch']) {
$('.chosen-select').chosen({allow_single_deselect:true});
$(window)
.off('resize.chosen')
.on('resize.chosen', function() {
$('.chosen-select').each(function() {
var $this = $(this);
$this.next().css({'width': $this.parent().width()});
});
}).trigger('resize.chosen');
$(document).on('settings.ace.chosen', function(e, event_name, event_val) {
if(event_name != 'sidebar_collapsed') return;
$('.chosen-select').each(function() {
var $this = $(this);
$this.next().css({'width': $this.parent().width()});
});
});
$('#chosen-multiple-style .btn').on('click', function(e){
var target = $(this).find('input[type=radio]');
var which = parseInt(target.val());
if(which == 2) $('#form-field-select-4').addClass('tag-input-style');
else $('#form-field-select-4').removeClass('tag-input-style');
});
}
//复选框全选控制
var active_class = 'active';
$('#simple-table > thead > tr > th input[type=checkbox]').eq(0).on('click', function(){
var th_checked = this.checked;//checkbox inside "TH" table header
$(this).closest('table').find('tbody > tr').each(function(){
var row = this;
if(th_checked) $(row).addClass(active_class).find('input[type=checkbox]').eq(0).prop('checked', true);
else $(row).removeClass(active_class).find('input[type=checkbox]').eq(0).prop('checked', false);
});
});
});
18271929370这个百度云中有下载
http://pan.baidu.com/s/1nuVEPVb
JS-日期框、下拉框、全选复选框的更多相关文章
- 下拉选择select和复选框checkbox的状态的各种方式
复选框的状态 <input name="ck" value=" " type="checkbox" checked> 或者&l ...
- UI自动化之特殊处理二(弹框\下拉框\选项\文件上传)
弹框\下拉框\选项\文件上传也是一些比较特殊的操作 目录 1.弹框 2.下拉框 3.选项 4.文件上传 1.弹框 弹框有三种形式,value为alert.confirm.prompt三种的弹框,第一个 ...
- [原创]纯JS实现网页中多选复选框checkbox和单选radio的美化效果
图片素材: 最终效果图: <html><title> 纯JS实现网页中多选复选框checkbox和单选radio的美化效果</title><head>& ...
- JavaScript---网络编程(11)--DHTML技术演示(4)-单选框/下拉菜单/添加文件
本节讲述单选框/下拉菜单/添加文件,综合css,html和JavaScript. 单选框: 实现的功能是:(类似平时的性格测试) 先隐藏一部分页面,然后通过点击单选框来显示. 再通过选项的选择-(每个 ...
- ComboBox 自动调整组合框下拉部分的宽度
/// <summary> /// ComboBox 自动调整组合框下拉部分的宽度 /// </summary> void Resiz ...
- WPF: 实现带全选复选框的列表控件
本文将说明如何创建一个带全选复选框的列表控件.其效果如下图: 这个控件是由一个复选框(CheckBox)与一个 ListView 组合而成.它的操作逻辑: 当选中“全选”时,列表中所有的项目都 ...
- QTableWidget自定义表头QHeaderView加全选复选框
1 QTableWidget自定义表头QHeaderView加全选复选框 在使用QTableWidget时需要在表头添加全选复选框,但是默认的表头无法添加复选框,只能用图片画上去一个复 ...
- WPF实现带全选复选框的列表控件
本文将说明如何创建一个带全选复选框的列表控件.其效果如下图: 这个控件是由一个复选框(CheckBox)与一个 ListView 组合而成.它的操作逻辑: 当选中“全选”时,列表中所有的项目都会被选中 ...
- Ajax跨域:Jsonp实例--百度搜索框下拉提示
Ajax跨域:Jsonp实例--百度搜索框下拉提示 一.总结 一句话总结:a.找好接口:b.用script标签的src引入文件(json数据):c.定义及实现上一步引入文件中的函数 1.如何找到一个网 ...
- JS列表的下拉菜单组件(仿美化控件select)
JS列表的下拉菜单组件(仿美化控件select) 2014-01-23 23:51 by 龙恩0707, 1101 阅读, 6 评论, 收藏, 编辑 今天是农历23 也是小年,在这祝福大家新年快乐!今 ...
随机推荐
- 简单的XML和JSON数据的处理
一.XML格式装换成json数据格式 using System; using System.Collections.Generic; using System.Linq; using System.W ...
- 2016 C++及系统软件技术大会亮点
2016 C++及系统软件技术大会将于201610月28日-29日在上海举办!此次2016 C++及系统软件技术大会秉承"全球专家. 连接智慧"的理念!大会特邀C++之父Bjarn ...
- Unity5系列资源管理AssetBundle——加载
上次我们进行了AssetBundle打包,现在我们还把打包的资源加载到我们的游戏中.在加载之前,我们需要把打包好的Bundle包裹放到服务器上,如果没有,也可以使用XAMPP搭建本地服务器. 加载的A ...
- PHP中使用CURL(四)
为了安全,我们的web服务主机往往不能上网.维护的时候,也是通过跳板机,ssh登录后去操作.有时候我们的程序需要访问外网.比如需要调用外网其他程序的某个接口.这时可以通过PHP的CURL函数的CURL ...
- 关于解决“No matching provisioning profiles found”问题-ios
xcode7之后真机调试就可以不需要调试证书了,但其中也会遇到一些问题令人挠头搔耳.记录下来是给自己提供方便,也为初遇到此问题的人提供解答,利人利己的事情我做! 上图: 图一 本人有一种视警号为e ...
- HyperSnap(屏幕抓图工具) 8.11.03 官方简体中文特别版
软件名称:屏幕抓图工具HyperSnap 软件分类:图像捕捉运行环境:WinXP/Win2003/Vista/Win7/Win8/WinALL软件语言:简体中文授权方式:免费软件软件大小:12462K ...
- I Think I Need a Houseboat
I Think I Need a Houseboat Time Limit : 2000/1000ms (Java/Other) Memory Limit : 65536/32768K (Java ...
- Prime Path(BFS)
Prime Path Time Limit : 2000/1000ms (Java/Other) Memory Limit : 131072/65536K (Java/Other) Total S ...
- php回传ajax数据
<?php $json_width = $_POST["img_width"]; $json_height = $_POST["img_height"]; ...
- AFNetWoring导入报错解决方案
第一个当报cannot find interface declaration for 'UIImage或者use of undeclared identifier 'UIImage'时我们要在报错页面 ...