JS-日期框、下拉框、全选复选框

时间:2022-09-22 19:21:58

<!-- 下拉框 -->
<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-日期框、下拉框、全选复选框的更多相关文章

  1. 下拉选择select和复选框checkbox的状态的各种方式

    复选框的状态 <input name="ck" value=" " type="checkbox"  checked> 或者&l ...

  2. UI自动化之特殊处理二(弹框&bsol;下拉框&bsol;选项&bsol;文件上传)

    弹框\下拉框\选项\文件上传也是一些比较特殊的操作 目录 1.弹框 2.下拉框 3.选项 4.文件上传 1.弹框 弹框有三种形式,value为alert.confirm.prompt三种的弹框,第一个 ...

  3. [原创]纯JS实现网页中多选复选框checkbox和单选radio的美化效果

    图片素材: 最终效果图: <html><title> 纯JS实现网页中多选复选框checkbox和单选radio的美化效果</title><head>& ...

  4. JavaScript---网络编程&lpar;11&rpar;--DHTML技术演示&lpar;4&rpar;-单选框&sol;下拉菜单&sol;添加文件

    本节讲述单选框/下拉菜单/添加文件,综合css,html和JavaScript. 单选框: 实现的功能是:(类似平时的性格测试) 先隐藏一部分页面,然后通过点击单选框来显示. 再通过选项的选择-(每个 ...

  5. ComboBox 自动调整组合框下拉部分的宽度

    /// <summary>        /// ComboBox 自动调整组合框下拉部分的宽度        /// </summary>        void Resiz ...

  6. WPF&colon; 实现带全选复选框的列表控件

    本文将说明如何创建一个带全选复选框的列表控件.其效果如下图:     这个控件是由一个复选框(CheckBox)与一个 ListView 组合而成.它的操作逻辑: 当选中“全选”时,列表中所有的项目都 ...

  7. QTableWidget自定义表头QHeaderView加全选复选框

    1         QTableWidget自定义表头QHeaderView加全选复选框 在使用QTableWidget时需要在表头添加全选复选框,但是默认的表头无法添加复选框,只能用图片画上去一个复 ...

  8. WPF实现带全选复选框的列表控件

    本文将说明如何创建一个带全选复选框的列表控件.其效果如下图: 这个控件是由一个复选框(CheckBox)与一个 ListView 组合而成.它的操作逻辑: 当选中“全选”时,列表中所有的项目都会被选中 ...

  9. Ajax跨域:Jsonp实例--百度搜索框下拉提示

    Ajax跨域:Jsonp实例--百度搜索框下拉提示 一.总结 一句话总结:a.找好接口:b.用script标签的src引入文件(json数据):c.定义及实现上一步引入文件中的函数 1.如何找到一个网 ...

  10. JS列表的下拉菜单组件&lpar;仿美化控件select&rpar;

    JS列表的下拉菜单组件(仿美化控件select) 2014-01-23 23:51 by 龙恩0707, 1101 阅读, 6 评论, 收藏, 编辑 今天是农历23 也是小年,在这祝福大家新年快乐!今 ...

随机推荐

  1. 移动端打印调试插件 - debug&period;js 介绍

    前文中我们学习过,用 Fiddler 作为代理可以在移动端打开本地的页面进行查看(如何用 fiddler 代理调试本地手机页面),但是对于 js 的调试却无能为力(需要借助其他调试手段,比如 UC浏览 ...

  2. Umbraco Content属性

    总算是有个内容还算多的Content的属性介绍,保存一下. https://our.umbraco.org/documentation/Reference/Management-v6/Models/C ...

  3. 关于ios的autoLayout的一些简单介绍以及使用方法

    一.autoLayout的用途: 主要用于屏幕适配,尤其是出现了iphone6,plus之后. 二.怎么简单的用autoLayout呢? 点击左一,可以看到: 点击左二: 基本上要想autolayou ...

  4. Pandas数据的去重,替换和离散化,异常值的检测

    数据转换 移除重复数据 import pandas as pd import numpy as np from pandas import Series data = pd.DataFrame( {' ...

  5. Unity 2D游戏开发教程之精灵的死亡和重生

    Unity 2D游戏开发教程之精灵的死亡和重生 精灵的死亡和重生 目前为止,游戏项目里的精灵只有Idle和Walking这两种状态.也就是说,无论精灵在游戏里做什么,它都不会进入其它的状态,如死亡.于 ...

  6. 为什么要用&amp&semi;lt&semi;&excl;DOCTYPE&amp&semi;gt&semi;声明

    实例: 我们常常会看到类似这种代码: <!DOCTYPE html> <html> <head> <title>文档的标题</title> ...

  7. 在函数体的&OpenCurlyDoubleQuote;出口处”,对 return 语句的正确性和效率进行检查

    在函数体的“出口处”,对 return 语句的正确性和效率进行检查. 如果函数有返回值,那么函数的“出口处”是 return 语句. 我们不要轻视 return 语 句.如果 return 语句写得不 ...

  8. 一个标准的AJAX请求

    这是一个标准的ajax请求: $.ajax({ type:"post", url:basePath+"/resourcePush/operationLog", ...

  9. Lua编程

    lua编程大杂烩.博客其他方面也不错.先记录.http://www.cnblogs.com/stephen-liu74/category/360139.html

  10. VS配置附加包含目录技巧

    把include文件夹(里面是某个库的头文件)拷到自己的项目中,添加头文件时需要使用#include"include\xxx.h"方式,如果打算使用#include"xx ...