今天开发代码时,发现好久不用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. jQuery function函数详解

    一.$(function(){}); $(document).ready(function(){})可以简写成$(function(){}); $(document).ready 里的代码是在页面内容 ...

  2. sql 以某个字段分组,另一个字段为参加比较的列,取得前n项的值

    假设表A有三个字段 { id int: subject varchar(20): socre int: } 语句为 select * from A  x where (select count(*) ...

  3. JDOJ1178:铺地板II

    JDOJ1178:铺地板II https://neooj.com/oldoj/problem.php?id=1178 题目描述 用1 x 1和2 x 2的磁砖不重叠地铺满N x 3的地板,共有多少种方 ...

  4. docker 创建mysql容器并且绑定到本地navicat

    docker pull mysql docker run --name mysql -itd -p 3306:3306 -e MYSQL_ROOT_PASSWORD=root1234 mysql do ...

  5. CF-weekly4 F. Kyoya and Colored Balls

    https://codeforces.com/gym/253910/problem/F F. Kyoya and Colored Balls time limit per test 2 seconds ...

  6. 探索clickout指令实现

    实现一个可复用的点击区域之外方法 随着3大框架的风靡,我们从以前的layer等UI库迁移到了更加强大的UI库,比如vue的好伙伴element,组件库的作用是封装一些常用的功能,将HTML.CSS.J ...

  7. C++ 基于rapidjson对json字符串的进行序列化与反序列化

    json字符串的解析以封装在我们开发过程中经常见到, 尤其在socket通信上面, 在一次项目中碰到json字符串的进行解析, 而公司有没有封装好的库, 于是就自己基于开源的库进行了一次封装, 接下是 ...

  8. 【Java语言特性学习之三】Java4种对象引用

    为了更灵活的控制对象的生命周期,在JDK1.2之后,引用被划分为(引用的级别和强度由高到低)强引用.软引用.弱引用.虚引用四种类型,每种类型有不同的生命周期,它们不同的地方就在于垃圾回收器对待它们会使 ...

  9. tf.ConfigProto()

    tf.ConfigProto一般用在创建session的时候用来对session进行参数配置 with tf.Session(config=tf.ConfigProto(...)...) tf.Con ...

  10. Entity Framework 6 中如何获取 EntityTypeConfiguration 的 Edm 信息?(四)

    经过上一篇,里面有测试代码,循环60万次,耗时14秒.本次我们增加缓存来优化它. DbContextExtensions.cs using System; using System.Collectio ...