精华内容
下载资源
问答
  • 复选框属性设置,属性获取

    千次阅读 2018-07-18 19:58:31
    (5)设置复选框属性 $("$iszfy").prop("checked", true); $("#iszfy").prop("checked", false); document.getElementById("iszfy").checked = true; (6)input标签对象获取 …… ...

    (1)全选

    HTML:<input type="checkbox" id="selectAllproduct" style="margin:8px" onclick="selectAll(this)">
    Jquery:
          function selectAll(a){
              var type = a.checked;  //选中:type=true; 取消选中:type=false
              $("#mintable input[name='productbox']").each(function() {
                  $(this).prop("checked", type); //相关该被选中的内容全部同步选中
              });
          }
    

    (2)获取多个被选中的复选框的值

    HTML:以下的input被循环产生,多个input共用一个name="productbox"

    <div><input type="checkbox" value="{{value.id}},{{value.name}}" name="productbox" class="productCheckbox">{{value.name}}</div>

    Jquery:

    function confirm(){
       var productname = $("#productname").val();
       $("#mintable input[name='productbox']").each(function(){
        var obj = $(this);
       if (obj.is(':checked')){
           var id_name = obj[0].value.split(",");
           //id_name = [value.id, value.name]
           //选中的值可取出用于业务逻辑
      document.getElementById("product_div").style.display = "none";
      }

    (3)div隐藏属性修改:此处不可用$("#product_div")这个方法获取div对象

    HTML:<div id="product_div"></div>

    JS:document.getElementById("product_div").style.display = "none";

            document.getElementById("product_div").style.display = "block";

    (4)获取复选框属性

    <input type="checkbox" id="iszfy" style="margin:8px"/>

    var var1 = $("#iszfy").prop("checked")

    var var2 = $("#iszfy").is(":checked")

    var var2 = document.getElementById("iszfy").checked

    (5)设置复选框属性

    <input type="checkbox" id="iszfy" style="margin:8px"/>

    $("$iszfy").prop("checked", true);

    $("#iszfy").prop("checked", false);

    document.getElementById("iszfy").checked = true;

    (6)input标签对象获取

    <table id = "tbl">

    <input type="checkbox" value="1" name="productbox" class="productCheckbox">

    <input type="checkbox" value="2" name="productbox" class="productCheckbox">

    <input type="checkbox" value="3" name="productbox" class="productCheckbox">

    ……

    </table>

    $("#tbl input[name="productbox"] ").each(function(){

                var obj = $(this);

                if (obj.is(":checked")){

                         //业务逻辑

                }

    });

    展开全文
  • 熟悉web前端开发的人都知道,判断复选框是否选中是经常做的事情,判断的方法很多,但是开发过程中常常忽略了这些方法的兼容性,而是实现效果就好了。博主之前用户不少方法,经常Google到一些这个不好那个不好的文章...
  • 我们只需要在渲染数据回调时找到每个复选框根据数据的不同来设置回显。 layui这里有一个坑,设置class属性后会造成二次点击效果,千万不要手动修改class属性,那么应该怎么办呢? 每次**点击**其中一个复选框时都会...
  • 复选框勾选状态下背景色的处理 <input type="checkbox"> ```css /* css 复选框 */ input[type=checkbox] { cursor: pointer; position: relative; } input[type=checkbox]::after { position: ...

    复选框勾选状态下背景色的处理

    <input type="checkbox">
    
    
    ```css
    
       /* css 复选框 */
        input[type=checkbox] {
            cursor: pointer;
            position: relative;
        }
    
        input[type=checkbox]::after {
            position: absolute;
            top: 0;
            background-color: #fff;
            color: #fff;
            width: 14px;
            height: 14px;
            display: inline-block;
            visibility: visible;
            padding-left: 0px;
            text-align: center;
            content: ' ';
            border-radius: 2px;
            box-sizing: border-box;
            border: 1px solid #ddd;
        }
    
        input[type=checkbox]:checked::after {
            content: "";
            background-color: #037DF3;
            border-color: #037DF3;
            background-color: #037DF3;
        }
    
        input[type=checkbox]:checked::before {
            content: '';
            position: absolute;
            top: 1px;
            left: 5px;
            width: 3px;
            height: 8px;
            border: solid white;
            border-width: 0 2px 2px 0;
            transform: rotate(45deg);
            z-index: 1;
        }
      </style>
    
    
    展开全文
  • 复选框的name属性

    千次阅读 2018-11-12 13:04:46
    HTML表单中,一组单选按钮(radio)或是一组复选框(checkbox)其中的name都是一样的。...一组复选框(checkbox):一般将name设置为name[],如果被选中,则在数组name中添加一个元素,在处理页面将如下获...

    HTML表单中,一组单选按钮(radio)或是一组复选框(checkbox)其中的name都是一样的。
    这是为了方便在处理页面获取表单传递的值。
    一组单选按钮(radio):因为name属性相同,所以只有一个能被选中,在处理页面就直接获取,如$_GET['name'];
    一组复选框(checkbox):一般将name设置为name[],如果被选中,则在数组name中添加一个元素,在处理页面将如下获取值:
     

    <?php
        foreach ($out as $key => $value) {
    	echo "<li>";
    	echo "<input id='a".$value['c_id']."' type='checkbox' name='chk_art[]' value='".$value['c_id']."'>";
            echo "<label for='a".$value['c_id']."'>".$value['article_type']."</label>";
    	echo "</li>";
        }
    ?>

     

    使用序列化传递数据

    // 表单序列化:此方法用于一般信息字符等可以,但是上传文件不行,上传文件用formdata
    		let data = $("form").serialize();

    php处理

    if(!empty($_POST['chk_art'])){
      for($i=0; $i< count($_POST['chk_art']); $i++){
          echo $array[$i].'<br />';
      }
    }

     

    展开全文
  • Web前端之复选框选中属性

    千次阅读 2014-11-27 11:26:47
    Web前端之复选框选中属性  熟悉web前端开发的人都知道,判断复选框是否选中是经常做的事情,判断的方法很多,但是开发过程中常常忽略了这些方法的兼容性,而是实现效果就好了。博主之前用户不少方法,经常...

    Web前端之复选框选中属性

      熟悉web前端开发的人都知道,判断复选框是否选中是经常做的事情,判断的方法很多,但是开发过程中常常忽略了这些方法的兼容性,而是实现效果就好了。博主之前用户不少方法,经常Google到一些这个不好那个不好的文章,到后面自己都混乱了。今天偶然看到一篇外国的博客,觉得讲解的很不错,打算翻译成中文,并加上了一些自己的见解。翻译的目的一是分享给大家,二是方便自己查阅。原文链接是:http://conceptf1.blogspot.com/2014/10/checkbox-checked-property.html。、

      如果你从事web开发并且在你开发的网页中有复选框,你可能需要判断当前该复选框是否选中,进而执行一些条件语句。有很多种方法来判断一个复选框是否选中。

      让我们先来看看原生的javascript是怎么判断这个属性的。在javascript中,在你选中了某个元素之后,你可以轻易地通过该元素的checked属性来判断你选中的复选框是否选中了。

      我们来看一个例子,在你的页面上面有一个复选框并且该复选框有着唯一的id,比如myCheckBox ,如下面所示:

    1 <input type="checkbox" id="myCheckBox"/>

      现在我们首先通过javascript来选中这个元素然后获取它的checked属性。

    复制代码
    1 function checkCheckBox() {
    2     if (document.getElementById('myCheckBox').checked) {
    3         //change it to alert('Its Checked'); if you not working with console
    4         console.log('Its Checked');
    5     } else {
    6         console.log('No its not Checked');
    7     }
    8 }
    复制代码

      可以看到,我们先通过id选中了这个元素然后判断它的checked属性,如果复选框选中了,它的值是true,如果复选框没有选中,它的值将是false。点击查看该例子

      如果你使用的是jQuery并且你不想用原生的javascript来进行这个判断,方法有很多:

      (1)使用 is(':checked')

         这个用法中你将使用jQuery的 is()函数。这个函数的功能是判断选中的元素或者元素集合是否满足你传递给该函数的条件参数,如果条件符合,返回true,否则返回false。

         所以为了使用这个函数,我们需要选中元素然后检测选择器:checked 的值,这个选择器适用于复选框、单选按钮和select标签。 点击查看该例子

    复制代码
    1 $('input[type="button"]').click(function () {
    2     if ($('#myCheckBox').is(':checked')) {
    3         //change it to alert('Its Checked'); if you not working with console
    4         console.log('Its Checked');
    5     } else {
    6         console.log('No its not Checked');
    7     }
    8 });
    复制代码

      (2)使用prop()

        在jQuery1.6之前,函数attr()用来获取元素的property 和attributes,但是非常容易让人产生疑惑。所以jQuery1.6之后,一个新的函数prop()来获取元素的当前的property值。

        但是在这之前,我们首先需要弄明白property 和attributes的区别。attributes是你给HTML标签设置的一些属性值,这包括你给一个标签设置的class、id甚至给输入框设定初始值一样。如果你没有在标签里面设置属性值但是却通过attr()来获取属性值,  会出现undefined的情况。prop()同样是用来获取元素的属性值,但是与attr()有着明显的区别的是,即便没有在html标签中定义想要获取的属性,也能够正确的返回需要的当前的属性值。

        根据官方的建议:具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()。

        为了直观的体现两者之间的差别,你可以再页面加载完成之后立即改变输入框的值,这时候你就会发现即便是你的输入框的值变化了,用attr()获取的属性值并不会随着文本的改变而改变,而通过property()来获取的属性值会随着文本框内容的变化而变化。

      看一个例子:

        这里我们有一个设置了初始值的和一些attribute属性集的输入框:

    1 <input type="text" id="myTextBox" value='set attribute value' /> 

        然后在JQuery代码里我们这样写:

    1 console.log('Attribute Value is : '+$('#myTextBox').attr('value'));
    2 console.log('Property Value is : '+$('#myTextBox').prop('value'));

        我们会发现,通过prop()来获取输入框里面的值永远都是和它里面的值同步的,而通过attr()老获取输入框里面的值一直都是在html标签里面设置的值。 点击查看该例子

      (3)使用 filter :checked

    1 var isChecked = $('#myCheckBox:checked').length > 0;

        另外一种用于判断这个属性的值的方法是在选择元素的时候加上一个过滤器  :checked,然后根据所获得的元素的长度来判断元素的属性。但是这种用法并不推荐,因为当你的页面上有很多组复选框并且使用class选择器而不是id选择器的时候,所得到的答案可能是错误的。 点击查看该例子

      我们能够看到,我们有好几种方法来获得复选款的选中属性。这也恰恰是web开发者经常需要用到并且在选择正确的使用方式时产生困惑的地方。

    展开全文
  • 问题: 复选框设置了:check:{ enable: true },页面却没显示复选框 可能的原因: 没有引入所需的js 解决方案: 引入jquery.ztree.excheck.min.js 如有错误,评论指正,谢谢~...
  • layui表格数据复选框回显设置

    千次阅读 2018-11-15 14:43:41
    我们只需要在渲染数据回调时找到每个复选框根据数据的不同来设置回显。 layui这里有一个坑,设置class属性后会造成二次点击效果,千万不要手动修改class属性,那么应该怎么办呢? 每次** 点击 **其中一个复选框...
  • 页面效果 目的 点击1复习框,则复选框2的状态都随之改变 ... ...1是为了点击此复选框跳转到响应...复选框状态响应函数 2就是跳转的函数 3表示:对class属性值为itemSelect元素,进行元素属性值更改,把checked...
  • 原因在于readonly属性关联的是页面元素的value属性(例如textbox,设置了readonly就不能修改输入框的文本内容),而复选框的勾选/取消并不改变其value属性,改变的只是一个checked状态。所以对于checkbox来说,设置...
  • jQuery 获取复选框checked属性

    千次阅读 2018-05-09 11:05:21
    我们平常获取属性值一般都是用attr() 但是attr()也有不好使的时候 例如获取复选框checked的属性值这是我们可以使用另一个jQuery的方法prop()$('input').prop('checked')//true = &gt;选中//false =&...
  • HTML复选框和提交按钮组合设置

    千次阅读 2015-08-05 16:39:27
    在html中怎样来创建复选框,对于创建复选框我们应该注意什么样的问题,这个html文档借助一个例子,很好的总结了对复选框设置设置复选框用到的标签是<form><input>我们队这些标签的属性应该怎样来写
  • 摘要:Delphi源码,界面编程,复选框 Delphi中的State属性用法举例,复选框实例,选中复选框后,适时显示复选框中的值在文本框中,这是一个面向Delphi初学者的State属性用法实例,熟悉Delphi的可以不看源码。
  • Flutter Checkbox 复选框

    万次阅读 2019-06-25 09:20:26
    Flutter 复选框 有两种:一 是精简版Checkbox复选框 ,二是自带标题和副标题CheckboxListTile复选框 参数详解 属性 说明 Checkbox 复选框 value 是否选中此复选框 onChanged 监听当复选框...
  • 目录 介绍 现场演示 ...您可以使用jQuery进行多选复选框下拉列表,而不是使用HTML中的多个属性。 这是一个简单的HTML控件,带有jQuery和CSS,可以在任何Web编程语言中使用。 现场演示 https...
  • 下面是纯CSS设置Checkbox复选框控件的五种简单样式,有兴趣的可以进行改动将其变成自己想要的样式。 首先,需要添加一段CSS隐藏所有的Checkbox复选框,下面我们会改变它的外观。要做到点需要添加一段代码到你的CSS...
  • 在Qt Designer中,tristate属性复选框checkBox相比较于QAbstractButton多出来的唯一属性。 tristate属性表示复选框是三种状态还是两种状态,如果tristate为True,则表示复选框有选中、未选中和半选中三种状态,...
  • 复选框+按钮的disabled属性

    千次阅读 2019-06-09 12:32:48
    在项目的需求中,有根据复选框的是否选中来改变页面的一些布局,今天小编就为大家介绍一种简单点的情况-----勾选复选框,对应按钮的disabled属性改变,按钮的点击效果也随之改变; HTML代码 <button type...
  • appium自动化中,如何操作复选框,单选框,滑动选项等,如下图 package com.appium.zhihu; import org.openqa.selenium.By; import com.appium.util.AppiumUtils; import io.appium.java_client.MobileBy; ...
  • 通过QStandardItem和QStandardItemModel可以很简单方便的给QTreeView添加节点,但是,许多树形控件都需要树的节点需要一个复选框(checkBox),网上许多资料都是通过自定义model来实现的,而且不能很好的实现checkbox...
  • 复选框Checkbox的只读设置

    千次阅读 2019-02-20 14:53:43
    最初,第一反应是使用readonly属性,但在复选框中,决定复选框值的是checked,而不是文本框等输入框的value值。所以这里使用readonly属性,会没有效果。  后面又尝试使用disabled属性,发现确实值不能变了。但是...
  • input checkbox 复选框大小修改

    万次阅读 2016-11-11 14:51:00
    有的时候,需要使用复选框,但是复选框有时候默认的太小,这时候就需要加大复选框,网上搜了很多,都没有直接的解决方法, 一种是采用div 扩大点击范围或者是采用图片替代。 直到看到下面一篇介绍,使...
  • ztree指定节点 设置复选框

    万次阅读 2018-03-28 16:16:02
    ztree指定节点 设置复选框 首先,需引入ztree的js文件 &amp;amp;amp;amp;amp;amp;amp;lt;script src=&amp;amp;amp;amp;amp;amp;quot;../../assets/ztree/js/jquery.ztree.core-3.5.min.js&amp...
  • 模拟QQ聊天树状结构图,添加复选框属性 下面是代码: 如上图我们的根节点ID为datass, 现在选择文字,复选框也会被选中。大家试试看吧;
  • 游戏开发中有时我们会用到CheckBox,CheckBox就是复选框,大家应该都见过复选框,它有两个状态,一个勾选态,一个非勾选态,我们可以通过CheckBox在这两个状态间的切换来实现一些特定的判断功能,比如是否游戏关闭...
  • easyui 设置复选框不能多选 是不是应该有个设置可以多选的属性 我没查到有多选这个属性 个人认为复选框应该是多选是默认的啊 不然要复选框干嘛 求解答

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 126,005
精华内容 50,402
关键字:

复选框属性怎么设置