1.两个select 内容互换

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <style>
        #s1,#s2{
            width: 300px;
        }
    </style>
    <body>
        <select size="7" id="s1">
           <option value="1">1</option>
           <option value="2">2</option>
           <option value="3">3</option>
           <option value="4">4</option>
           <option value="5">5</option>
        </select>
        <input type="button" id="b1" value="向左 " />
        <input type="button" id="b2" value="向右"  />
        <input type="button" id = "b3" value="全选" />
        <select size="7" id="s2">
        <option value="a">a</option>
        <option value="b">b</option>    
        <option value="c">c</option>    
        <option value="d">d</option>    
        <option value="e">e</option>    
        </select>
    </body>
</html>
<!--select互换-->
<script>
    var s1 = document.getElementById("s1")
    var s2 = document.getElementById("s2")
    var b1 = document.getElementById("b1")
    var b2 = document.getElementById("b2")
    var b3 = document.getElementById("b3")
    b1.onclick = function(){
        s1.innerHTML += "<option>"+s2.value+"</option>"
        s2.value = ""
    }
    b2.onclick = function(){
        s2.innerHTML += "<option>"+s1.value+"</option>"
        s1.value = ""
    }
    b3.onclick = function(){
        
    }
    
</script>

2.单选按钮  同意可点击下一步

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <input type="radio"  id = "b1" />
        <input type="button" id="b2" value="下一步"  disabled="disabled"/>
    </body>
</html>
<script>
//    单选按钮
    var b1 = document.getElementById("b1");
    var b2 = document.getElementById("b2");
    b1.onclick = function(){
        if(b1.checked){
            b2.removeAttribute("disabled");
        }else{
            b2.setAttribute("disabled","disabled")
        }
    }
</script>

3.全选框

<!DOCTYPE html>
<html>

<head>
        <meta charset="UTF-8">
        <title></title>
    </head>

<body>
        全选:<input type="button" id="b1" value="全选" /> 不选:
        <input type="button" id="b2" value="全不选" /> 反选:
        <input type="button" id="b3" value="反选" />
        <div id="div">
            <input type="checkbox" />
            <input type="checkbox" />
            <input type="checkbox" />
            <input type="checkbox" />
            <input type="checkbox" />
        </div>
    </body>

</html>
<script>
    window.onload = function() {
        var b1 = document.getElementById("b1")
        var b2 = document.getElementById("b2")
        var b3 = document.getElementById("b3")
        var div = document.getElementById("div")
        var inp = div.getElementsByTagName("input")
        b1.onclick = function() {
            for(a = 0; a < inp.length; a++) {
                
                inp[a].checked = true;
            }
        }
        b2.onclick = function() {
            for(a = 0; a < inp.length; a++) {
                inp[a].checked = false;
            };
        };
        b3.onclick = function() {
            for(a = 0; a < inp.length; a++) {
                if(inp[a].checked == true) {
                    inp[a].checked = false;
                } else {
                    inp[a].checked = true;
                }
            };
        };
    };
</script>

2017 年 9 月 27 日 js(1.两个select 内容互换 2.单选按钮 同意可点击下一步 3. 全选框)的更多相关文章

  1. 2017 年 9 月 27 日 js(文本框内容添加到select)

    写法 <!DOCTYPE html><html>    <head>        <meta charset="UTF-8">   ...

  2. 2017年12月24日 JS跟Jquery基础

    js基础 alert();confirm(); 基础语法:与C#一致数据类型及类型转换var (string,decimal)parseInt()parseFloat();isNaN(); 运算符:数 ...

  3. 2017年2月27日Unicorn,　US (148) and China (69), followed by the U.K. (10), India (9), Israel (5) and Germany (5).

    Revisiting The Unicorn Club Get to know the newest crowd of billion dollar startups In 2013, when Ai ...

  4. 2017年11月27日 C#MDI窗体创建&记事本打印&记事本查找、自动换行

    MDI窗体第一个父窗体 把属性里的IsMdiContainer设置为true就可以了 父窗体连接子窗体 //创建一个新的类,用来连接别的窗体,并且别的窗体为唯一窗体 List<Form> ...

  5. 2017年1月1日 星期日 --出埃及记 Exodus 21:27

    2017年1月1日 星期日 --出埃及记 Exodus 21:27 And if he knocks out the tooth of a manservant or maidservant, he ...

  6. 导航狗IT周报-2018年05月27日

    原文链接:https://www.daohanggou.cn/2018/05/27/it-weekly-9/ 摘要: “灰袍技能圈子”将闭圈:物理安全:为什么我们现在的生活节奏越来越快? 技术干货 1 ...

  7. 免费公共DNS服务器IP地址大全（2017年6月24日）

    收集全球各个常用公共DNS服务器 IP地址,欢迎各位朋友评论补充! 国内常用公共DNS 114 DNS: (114.114.114.114:    114.114.115.115) 114DNS安全版 ...

  8. 猖獗的假新闻：2017年1月1日起iOS的APP必须使用HTTPS

    一.假新闻如此猖獗 刚才一位老同事 打电话问:我们公司还是用的HTTP,马上就到2017年了,提交AppStore会被拒绝,怎么办? 公司里已经有很多人问过这个问题,回答一下: HTTP还是可以正常提 ...

  9. 腾讯QQ认证空间4月27日已全面开放申请，欲进军自媒体

    今天看到卢松松的博客上爆出,腾讯QQ认证空间4月27日已全面开放申请的消息,这一消息出来, 马浩周根据提示方法进行申请,下面先说说腾讯QQ认证空间的申请方法: QQ认证空间开放申请公告地址:http: ...

随机推荐

  1. 80端口被system（pid=4）占用

    1.查看80端口被哪个进程占用,cmd->netstat -ano | findstr 80 2.cmd->tasklist列出当前运行中的进程,或在任务管理器中查看pid为4的进程. 经 ...

  2. 【bzoj3930】选数 容斥原理+暴力

    Description 我们知道,从区间[L,H](L和H为整数)中选取N个整数,总共有(H-L+1)^N种方案.小z很好奇这样选出的数的最大公约数的规律,他决定对每种方案选出的N个整数都求一次最大公 ...

  3. 洛谷P2766 最长不下降子序列问题（最大流）

    传送门 第一问直接$dp$解决,求出$len$ 然后用$f[i]$表示以$i$为结尾的最长不下降子序列长度,把每一个点拆成$A_i,B_i$两个点,然后从$A_i$向$B_i$连容量为$1$的边 然后 ...

  4. python3入门之列表和元组

    获得更多资料欢迎进入我的网站或者 csdn或者博客园 前面一张主要学习了Python的安装,以及第一个程序helloword的编写,以及简单的输入和输出函数,这章主要介绍序列,列表,元组 序列  这章 ...

  5. Python3用sys和time模块实现进度条

    import sys import time def view_bar(num, total): rate = float(num) / float(total) rate_num = int(rat ...

  6. 查看SELinux状态及关闭SELinux

    查看SELinux状态: 输入:/usr/sbin/sestatus -v SELinux status: enabled           ##开启状态 关闭SELinux 修改vi /etc/s ...

  7. 瀑布模型，（增量开发）渐增式开发，原型化开发，统一过程模型（RUP）

    瀑布模型:设计在开发阶段 瀑布模型有以下优点 1)为项目提供了按阶段划分的检查点. 2)当前一阶段完成后,您只需要去关注后续阶段. 3)可在迭代模型中应用瀑布模型. 增量迭代应用于瀑布模型.迭代1解决 ...

  8. HDU - 2604 矩阵快速幂 字符串递推 两种解法

    记dp[i]为长度i且符合题意的方案数,dp[n]就是解 符合方案的是不含fmf和fff子串的字符串 考虑如何从前面几项递推出后面第i项 (★表示存在生成的非法方案)←其实没啥用处 i=1时 m③ f ...

  9. Spring对外部属性文件指定的某个属性进行加密、解密

    [From] http://blog.csdn.net/ethanq/article/details/7333897 在我们开发当中,经常会用到spring框架来读取属性文件的属性值,然后使用占位符引 ...

  10. PIE SDK屏幕坐标和地图坐标转换

    1. 功能简介 屏幕坐标和地图坐标转换,就是字面意思,将电脑屏幕的坐标转换为带有空间信息的地图坐标,主要运用PIE SDK地图控件的ToMapPoint()方法,而地图坐标转换为设备坐标(屏幕),用的 ...