今天开发代码时,发现好久不用jquery就生疏了。

所以作这个记录,

使用checkbox控制div的显示与隐藏。

一,html代码处:

<input type="checkbox" name="checkYaml" id="checkYaml" /> Yaml发布
<div  id="branch_build_div">
    {{ form.branch_build }}
</div>

二,JS代码处:

$(document).ready(function(){

    // 如果是Yaml发布,用户就不用输入git的代码分支了,因为直接使用配置好的yaml文件,连编译镜像都不需要的。
    $("#checkYaml").change(function() {
        if ($("#checkYaml").prop("checked")) {
            $("#branch_build_div").hide();
        } else {
            $("#branch_build_div").show();
        }

    });
});

三,如果是在django的formview中,使用如下方式,可以获取这个额外的form选项(因为这个checkbox并没有反映在forms.Form继承类中)。

def form_valid(self, form):
    check_yaml = self.request.POST.get('checkYaml')

简简单单,jquery中,使用checkbox控制div的显示与隐藏的更多相关文章

  1. jquery实现点击控制div的显示和隐藏

    我们使用点击显示.点击隐藏的时候,一般有两种可选方案 .示例 html <div class="index"> <h1> 首页 </h1> &l ...

  2. 原生JS的移入溢出控制div的显示与隐藏

    原生JS的移入溢出控制div的显示与隐藏的写法 上面的写法火狐存在兼容性

  3. js控制div样式显示与隐藏,JS通过点击超链接右边(指定位置)显示一个图标

    原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...

  4. jquery控制css的display(控制元素的显示与隐藏)

    使用jquery控制div的显示与隐藏: $("#div的id").show()表示display:block, $("#div的id").hide()表示di ...

  5. jquery控制元素的显示与隐藏

    比如要控制div的显示与隐藏,一句话就搞定了.$("#id").show()表示display:block,$("#id").hide()表示display:n ...

  6. jquery中选择checkbox拼接成字符串,然后到后台拆分取值

    jquery中选择checkbox拼接成字符串,然后到后台拆分取值 js中的代码 $("#btn").click(function(){ var chenked=$("i ...

  7. jquery怎么实现点击一个按钮控制一个div的显示和隐藏

    示例html 1 2 <div class="abc" style="display:none"></div> <input ty ...

  8. js 控制Div循环显示 非插件版

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. jQuery判断当前元素显示状态并控制元素的显示与隐藏

    1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible');   //true为显示,false为隐藏 $("#id") ...

随机推荐

  1. 如何在类中根据枚举值,获取枚举的message的工具类

    枚举类为: public enum OrderStatusEnum implements CondeEnum{ NEW(0, "新订单"), FINISHED(1, "完 ...

  2. CodeForces 984C Finite or not?

    http://codeforces.com/problemset/problem/984/C Time limit    1000 msMemory limit    262144 kB 题目 You ...

  3. 《LinuxTools》

    https://zhuanlan.zhihu.com/p/37196870 Linux基础 Linux工具进阶 工具参考篇 1. gdb 调试利器 2. ldd 查看程序依赖库 3. lsof 一切皆 ...

  4. 史上最全的LaTeX特殊符号语法

    史上最全的LaTeX特殊符号语法 运算符 语法 效果 语法 效果 语法 效果 + \(+\) - \(-\) \triangleleft \(\triangleleft\) \pm \(\pm\) \ ...

  5. Python __slots__

    Python 类的特殊变量:__slots__ 使用 __slots__ 后,类中 __weakref__ 和 __dict__ 消失,同时阻止动态属性绑定 由于 __dict__ 记录着类中所有的属 ...

  6. MySQL 行溢出数据

    MySQL 行溢出数据 MySQL 对一条记录占用的最大储存空间是有限制的,除了 BLOB 和 TEXT 类型之外,其他所有列 (不包括隐藏列和记录头信息) 占用的字节长度不能超过 65535 个字节 ...

  7. django自定义错误处理

    要实现自定义错误处理的功能,总共分4步: 1.创建html错误页 2.配置settings ,当DEBUG=True,则不会生效 3.编写视图 4.配置url views.py   def page_ ...

  8. appium--使用PyYAML封装Capability

    前戏 YAML 语言的设计目标,就是方便人类读写.它实质上是一种通用的数据串行化格式. 它的基本语法规则如下. YAML大小写敏感: 使用缩进代表层级关系: 缩进只能使用空格,不能使用TAB,不要求空 ...

  9. [东西]neverOpen

    一.介绍 用于完成一项光荣而伟大的使命. 二.更新日志 当前版本:V5.0 - 20191107 --------------------------------------------------- ...

  10. NOIP 2011 提高组初赛错题简析

    Preface 好久没做初赛题了,据说今年的审核会更加严苛,作为一名去年未PY时只有\(92\)分的蒟蒻,我今年看来是\(90\)分都莫得了 然而今年也没怎么看重初赛,结果现在才来做,翻车到了\(84 ...