【js】关于checkbox

最新推荐文章于 2021-08-05 14:53:54 发布
最新推荐文章于 2021-08-05 14:53:54 发布
阅读量338 收藏
点赞数
分类专栏： js appcan
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u010918847/article/details/50596307
版权
js 同时被 2 个专栏收录
5 篇文章 0 订阅
订阅专栏
appcan
2 篇文章 0 订阅
订阅专栏 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <meta charset="utf-8">
        <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
        <link rel="stylesheet" href="css/fonts/font-awesome.min.css">
        <link rel="stylesheet" href="css/ui-box.css">
        <link rel="stylesheet" href="css/ui-base.css">
        <link rel="stylesheet" href="css/ui-color.css">
        <link rel="stylesheet" href="css/appcan.icon.css">
        <link rel="stylesheet" href="css/appcan.control.css">
        <link rel="stylesheet" href="123456_content/css/main.css">
    </head>
    <body>

        <div id="btn1"style=" position: absolute;left:-2em;top:0em;height: 36em;background-color: black; opacity:0.5;width: 100em"></div>
        <div id="btn"style="position: absolute;left: 15%;top: 40%;width: 70%;height: 30%;background-color: #FFFFFF;border-radius: 0.5em">
            <div id="" style="width: 100%;height: 1.5em;border-radius: 0.5em;font-size: 1.2em;text-align: center;padding-top: 0.2em;font-weight: 900">
                请选择您的预算金额
            </div>
            <div id="" style=";height: 6em" >
                <div id=""style="height: 3em" >

                    <div id=""class="ub-f1" style="float: left;width: 7em;height: 3em;text-align: center">
                        <li class=" ub  bc-text ub-ac lis" data-index="0" style="">
                            <div class="checkbox umar-r" style="">
                                <input   type="checkbox" class="uabs ub-con" value="300" name="money" οnclick="chosemoney(this)">
                            </div>
                            <div class="lv_title ub-f1 marg-l ub ub-ver ut-m line1" style="color: #B07F47">
                                300
                            </div>
                        </li>
                    </div>
                    <div id=""class="ub-f1" style="float: right;width: 6.8em;height: 3em;text-align: center">
                        <li class=" ub  bc-text ub-ac lis" data-index="0" style="">
                            <div class="checkbox umar-r" style="">
                                <input   type="checkbox" class="uabs ub-con " value="600" name="money" οnclick="chosemoney(this)">
                            </div>
                            <div class="lv_title ub-f1 marg-l ub ub-ver ut-m line1" style="color: #B07F47">
                                600
                            </div>
                        </li>
                    </div>
                    <div id=""style="clear: both">

                    </div>
                </div>
                <div id="" style="height: 3em;">
                    <div id=""class="ub-f1" style="float: left;width: 7em;height: 3em;text-align: center">
                        <li class=" ub  bc-text ub-ac lis" data-index="0" style="">
                            <div class="checkbox umar-r" style="">
                                <input id="900" name="money" type="checkbox" value="900" class="uabs ub-con " οnclick="chosemoney(this)" >
                            </div>
                            <div class="lv_title ub-f1 marg-l ub ub-ver ut-m line1" style="color: #B07F47" >
                                900
                            </div>
                        </li>
                    </div>
                    <div id=""class="ub-f1" style="float: right;width: 6.8em;height: 3em;text-align: center">
                        <li class=" ub  bc-text ub-ac lis" data-index="0" style="">
                            <div class="checkbox umar-r" style="">
                                <input  type="checkbox" class="uabs ub-con "  value="1200" name="money" οnclick="chosemoney(this)">
                            </div>
                            <div class=" lv_title ub-f1 marg-l ub ub-ver ut-m line1" style="color: #B07F47" >
                                1200
                            </div>
                        </li>
                    </div>
                    <div id=""style="clear: both">

                    </div>
                </div>
            </div>
            <div id=""style=";height: 2.5em;border-top: 1px solid #888"  >

                <div id="sure" style="float: left;height: 1.7em;width: 5.5em;border-right: 1px solid #888;text-align: center;padding-top: 0.5em;font-size:1.2em ;font-weight: 900;color: #BA9163" >
                    确定
                </div>
                <div id="quxiao" style="text-align: center;padding-top: 0.5em;font-size:1.2em ;font-weight: 900;color: #939393;float: right;width: 6em;height: 2em">
                    取消
                </div>
                <div id=""style="clear: both">

                </div>
            </div>

        </div>
        <script src="js/appcan.js"></script>
        <script src="js/appcan.control.js"></script>
    </body>
    <script>
        appcan.ready(function() {
            appcan.initBounce();
            //alert(0);

        })
        ///点击事件
        var themoney=0;
        function chosemoney(v) {
            
          for(var i=0;i<$('input').length;i++){
              $('input')[i].checked=false;
              
          }
            //$('checkbox').attr('checked', false);
            v.checked=true;
           
        }

        ///
        appcan.button("#sure", "btn-act", function() {
            for(var i=0;i<$('input').length;i++){
             if( $('input')[i].checked){
                 themoney=$('input')[i].value;
                 //alert(themoney);
                 appcan.window.publish('themoney',themoney);
             }
              
          }
            
            appcan.window.publish('1',themoney);
            appcan.window.close('Assistance');
            //appcan.window.open('Releasedemand', 'Releasedemand.html', 0);
        })
        appcan.button("#btn1", "btn-act", function() {

            appcan.window.close('Assistance');

        })

    </script>
</html>

不善言辞-不行于色
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js中关于checkbox的一些操作
qq_45844443的博客
10-21 1493
s根据字符串与checkbox的value值一样进行选中代码 代码 var fieldStrValue="a,b,c,d,e,f,g"; //带有逗号的字符串 var names = fieldStrValue.split(","); //获取的字符串转换为数组 var inputs = document.getElementsByClassName('checkbox-list'); //获取class为'checkbox-list'的input框 for (var i = 0; i < in
js实现checkbox全选
liangshui999的博客
07-02 3153
checkbox选中状态主要是靠checked属性控制，js获取设置属性可以直接通过.来控制，或者通过getAttribute()，setAttribute()控制 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title&l...
js实现CheckBox单选多选全选功能
chen_ac的博客
08-05 4452
js实现CheckBox单选多选全选功能 在checkbox的使用中，我们经常遇到需要全选或者单选的情况，通过js定义函数可以方便实现需求，提高用户体验感。 定义多个CheckBox <div> <input type="checkbox" id="all" @click="checkAll"> <label for="all">全选</label> <br><hr> <input id="chec
JavaScript操作checkbox复选框
人生若只如初见的博客
06-17 1万+
JavaScript操作checkbox的方式和操作radio的方式相似，都是利用元素项的checked属性来完成。先获取checkbox元素集合，遍历集合，对集合中的每一项做操作。 取值 <body> <p> <label for="hobby">Hobby: <input type="checkbox" name="hobby" va...
使用js操作checkbox
热门推荐
fengzhen8023
07-31 3万+
我们在项目中经常会遇到这个问题：使用js判断checkbox框是否被选中以及使用js对checkbox进行操作。 其实这些需求很简单，这里给出使用原生js和jQuery来完成这些需求。 一.使用原生JavaScript判断是否选中checkbox框 &amp;lt;input type=&quot;checkbox&quot; id=&quot;test&quot; class=&quot;test&quot;&amp
javascript 多级checkbox选择效果
10-29
多级checkbox选择效果,具体的效果可以看下面的图，有需要的朋友可以参考下。
JS实现checkbox互斥(单选)功能示例
10-17
主要介绍了JS实现checkbox互斥(单选)功能,涉及JavaScript针对页面元素属性的判断及动态操作相关实现技巧,需要的朋友可以参考下
CheckBoxGroup.js:CheckBoxGroup JavaScript 类
06-21
复选框组.js CheckBoxGroup JavaScript 类
javascript中checkbox使用方法实例演示
10-23
通过简单的实例演示了javascript中checkbox使用方法，感兴趣的小伙伴们可以参考一下
javascript获得CheckBoxList选中的数量
10-29
javascript获得CheckBoxList选中的数量(jQuery与Javascript对照学习/前台与后台)
【APPCAN】的页面传值
u010918847的专栏
10-16 4570
APPCAN页面传值，有三种方法，但是总觉得前两种建立接口监听的方法不好使。 感觉最好使的还是本地存储的方法。 总的流程是从solve_content.html----------->detail.html页面。下边分别是solve_content.html页面和detail.html页面。
【js:jquery】jquery选择器与事件监听
u010918847的专栏
09-19 3929
1.所谓为选择器就是像js中 getElementById 或者getElementByClass 一样获取页面中的元素。 以下为jQuery选择器获取到对象的方法： $('')中填写的内容不一样，选择器也不一样。大致的有以下几种：     格式 实例 选取 * $('*') 获取页面中所有元素 # $('#id') 获取对应ID元素 . $('.class') 获取对象类名的
【js】检测CSS JS 文件是否被引入。
u010918847的专栏
07-20 3240
直接写在js代码里，对应的改掉名字即可。
【js】获取url参数
u010918847的专栏
11-01 794
1.所处环境条件： url 地址为：http://127.0.0.1/index.php/home/type/updata.html?id=35 2.所需函数： function getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对
node-v9.6.0-x86.msi
04-29
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
Python基于机器学习的分布式系统故障诊断系统源代码，分布式系统的故障数据进行分析，设计故障诊断模型，高效地分析并识别故障类别
04-29
基于技术手段（包括但不限于机器学习、深度学习等技术）对分布式系统的故障数据进行分析，设计故障诊断模型，高效地分析并识别故障类别，实现分布式系统故障运维的智能化，快速恢复故障的同时大大降低分布式系统运维工作的难度，减少运维对人力资源的消耗。在分布式系统中某个节点发生故障时，故障会沿着分布式系统的拓扑结构进行传播，造成自身节点及其邻接节点相关的KPI指标和发生大量日志异常
JavaScript前端开发的核心语言前端开发的核心语言
最新发布
04-29
javascript 当今互联网时代，JavaScript已经成为了前端开发的核心语言它是一种高级程序设计语言，通常用于网页的交互和动态效果的实现。JavaScript的灵活性以及广泛的使用使得它变得异常重要，能够为用户带来更好的用户体验。 JavaScript的特点之一是它的轻量级，它可以在网页中运行无需单独的编译或下载。这意味着网页可以更快地加载并且用户无需安装额外的软件才能运行网页上的JavaScript代码。此外，与HTML和CSS紧密结合，可以直接在HTML文档中嵌入，使得网页的开发变得非常便捷。 JavaScript具有动态性，它可以在浏览器中实时修改页面内容和样。它可以通过操作DOM（文档对象模型来动态地修改网页的结构和布局，并且可以根据用户的行为实时地响应各种事件，如点击、标悬停、滚动等。这使得开发者可以轻松地为网页添加交互性和动态效果，提供更好的用户体验。 JavaScript也是一种面向对象的语言。它支持对象、类、继承、多态等面向对象编程的概念，使得代码结构更加清晰和可维护。开发者可以创建自定义的对象和方法，对功能进行封装和复用，提高代码的可读性和可维护性。
四则运算自动生成程序安装包
04-29
四则运算自动生成程序安装包
js全选checkbox
08-23
要实现 JavaScript 中的全选 checkbox 功能，你可以使用以下代码片段： ```html <input type="checkbox" id="selectAll" onchange="selectAllCheckboxes()"> 全选 <input type="checkbox" class="checkbox-item"> ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值