今天开发代码时,发现好久不用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. 在安装完jdk以后,发现javac不能执行

    安装和配置环境变量都按着流程在,但在最后的检验时,发现Java   Java -version 都能运行,唯独Javac 报“不能识别命令”错误信息,下面列出我遇到一个尴尬问题 在path变量里

  2. [转] 从零推导支持向量机 (SVM)

    原文连接 - https://zhuanlan.zhihu.com/p/31652569 摘要 支持向量机 (SVM) 是一个非常经典且高效的分类模型.但是,支持向量机中涉及许多复杂的数学推导,并需要 ...

  3. [C11] 推荐系统(Recommender Systems)

    推荐系统(Recommender Systems) 问题阐述(Problem Formulation) 将 推荐系统 纳入这门课程来讲有以下两个原因: 第一.仅仅因为它是机器学习中的一个重要的应用.在 ...

  4. 2019年最新50道java基础部分面试题

    [软帝学院]1. Java基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法,线程的语法,集合的语法,io 的语法,虚拟机方面的语法. 1.一个".j ...

  5. selenium定位元素的八种方法

    web driver提供了八种元素定位的方法: id, name, class name, tag name, link text, partial link text, xpath, css sel ...

  6. Ubuntu下的录GIF神器——Peek

    最近一直在找Ubuntu下面录GIF好用方便的软件一直没找到,很多都是要获取录屏四角的坐标,现在终于找到了,就是我们的录GIF神器——Peek. 1 获取Peek的ppa源 sudo add-apt- ...

  7. SOA案例分析浅谈

    SOA是英文 Service-Oriented Architecture 三个首字母单词的缩写,中文译为: 面向服务架构 ( SOA), SOA架构与 B/S . C/S 架构是目前最流行三种 Web ...

  8. [PKUSC2018]最大前缀和(状压DP)

    题目大意:求给定的 $n$ 个数的所有排列的最大前缀和(不能为空)之和对 $10^9+7$ 取模的值. $1\le n\le 20,1\le\sum|a_i|\le 10^9$. 神级DP.杂题选讲的 ...

  9. mybatis+postgresql10插入返回主键ID

    MyBatis如果使用useGeneratedKeys去生成自增列会造成不成功,因为官方提供只支持这些数据库:mybatis generatedkeys,那么如果要用在oracle和postgresq ...

  10. 使用 jQuery.TypeAhead 让文本框自动完成 (四)(自定义模板)

    项目地址:https://github.com/twitter/typeahead.js 直接贴代码了: @section headSection { <script type="te ...