zoukankan      html  css  js  c++  java
  • dom习题复习和讲解

      今天没有学习新的知识点,主要是把习题做了一遍,老师讲解了一下。下面是习题的讲解:

      左右两个下拉框相互移动:

      首先body里面:

      

      <body>
      <select id="slt" style="100px;height:100px" size="7">
      <option>123</option>
      <option>456</option>

      </select>

      <input type="button" id="btn" value=">>>" />
      <input type="button" id="btn1" value="<<<" />
      <select id="set" style="100px;height:100px" size="7">
      <option id="d1">678</option>
      <option>890</option>

      </select>
      </body>

      然后是script里面:

      <script>
      var slt = document.getElementById("slt");
      var set = document.getElementById("set");
      var btn = document.getElementById("btn");

      btn.onclick = function () {

      var opt = slt.selectedOptions[0];
      var value = opt.innerText;
      set.appendChild(opt);

      }

      btn1.onclick = function(){
      var opt1 = set.selectedOptions[0];
      var value = opt1.innerText;
      slt.appendChild(opt1);




      }
      </script>

      还有一个很重要的就是如果点了条款才能点选择:

      首先body里面:

      

      <body>
      <input type="checkbox" id="ckb" /><label for="ckb">同 意</label>
      <input id="btn" type="button" value="下一步" disabled="disabled" />
      </body>

      然后是script里面:

      

      <script>
      var ckb = document.getElementById("ckb");
      var btn = document.getElementById("btn");
      ckb.onchange = function(){
      var status = ckb.checked;
      if(status == true){
      btn.removeAttribute("disabled");
      }else{
      btn.setAttribute("disabled","disabled");
      }
      }
      </script>

      还有一个题需要消化一下,等我弄懂了再打一次,好好琢磨琢磨一下。

      

  • 相关阅读:
    Eclipse创建Python工程
    MySQL python安装
    pip安装-python2.7.15
    接口测试-HTTP重点知识及 测试工具
    接口测试-基础
    关闭win10的自动更新功能
    高版本MySQL(5.7,5.8)的JDBC连接新问题
    错误:java.sql.SQLException: Access denied for user ''@'localhost' (using password: NO)
    Idea SpringBoot工程提示 "Error running 'xxxx'": Command line is too long... 问题解决
    错误:23:36:21.161 [main] ERROR org.springframework.boot.SpringApplication
  • 原文地址:https://www.cnblogs.com/liuyubin0629/p/6891452.html
Copyright © 2011-2022 走看看