zoukankan      html  css  js  c++  java
  • MUI

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
        <title></title>
        <script src="js/mui.min.js"></script>
        <link href="css/mui.min.css" rel="stylesheet"/>
        <script type="text/javascript" charset="utf-8">
              mui.init();
        </script>
    </head>
    <body>
        <header class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">hello</h1>
    </header>
    <div class="mui-content">
    <span class="mui-badge mui-badge-inverted">1</span>
    <span class="mui-badge mui-badge-primary mui-badge-inverted">2</span>
    
        <div class="mui-input-row mui-radio mui-left">
            <label>运动</label>
            <input name="checkbox1" value="运动" type="radio" class="rds"/>
        </div>
    
        <div class="mui-input-row mui-radio mui-left">
          <label>篮球</label>
          <input name="checkbox1" value="篮球" type="radio" class="rds"/>
        </div>
    
    <button type="botton" onclick="getVals();">获取复选框的值</button>
    
    
        <div class="mui-input-row mui-checkbox mui-left">
            <label>运动</label>
            <input name="checkbox1" value="运动" type="checkbox" class="rdss"/>
        </div>
    
        <div class="mui-input-row mui-checkbox mui-left">
          <label>篮球</label>
          <input name="checkbox1" value="篮球" type="checkbox" class="rdss"/>
        </div>
    
    <button type="botton" onclick="getVal();">获取多选框的值</button>
    
    </div>
    </body>
    <script type="text/javascript">
        /*复选框的请求方法*/
        function getVals(){
            var res = getRadioRes('rds');
            if(res == null){
                mui.toast('请选择');
                return false;
            }
            mui.toast(res);
        }
        /*多选框的触发方法*/
        function getVal(){
            var res = getcheckBoxRes('rdss');
            if(res.length < 1){
                mui.toast('请选择');
                return false;
            }
            mui.toast(res);
        }
        
        //封装的方法获取复选款的数据
        function getRadioRes(className){
            var rdsobj = document.getElementsByClassName(className);
            //alert(rdsobj.length);
            var checkVal = null;
            for(i=0; i<rdsobj.length;i++){
                if(rdsobj[i].checked){
                    checkVal = rdsobj[i].value;
                }
            }
            return checkVal;
        }
        
        //封装的方法 获取多选框的数据
        function getcheckBoxRes(className){
            var rdsobj = document.getElementsByClassName(className);
            var checkVal = new Array();
            var $k = 0;
            for(i = 0; i<rdsobj.length; i++){
                if(rdsobj[i].checked){
                    checkVal[$k] = rdsobj[i].value;
                    $k++;
                }
            }
            return checkVal;
        }
    </script>
    </html>
  • 相关阅读:
    4种定位的区别
    tab切换插件
    CPU的cache知识
    linux free命令详解
    关于登录linux时,/etc/profile、~/.bash_profile等几个文件的执行过程
    职业规范(运维)
    数据库的横表和纵表
    Linux下的xargs的用法
    LINUX ulimit命令
    防火墙并发连接数
  • 原文地址:https://www.cnblogs.com/zc290987034/p/8810526.html
Copyright © 2011-2022 走看看