• 【js教程】遍历checkbox提交之后显示打钩


    原址:http://wenku.baidu.com/view/0d30474bfe4733687e21aa31.html

    今天想要做个好友发信功能模块,但是不太了解checkboxjs结合的属性和作用,于是就上网找了些例子来分析一下。

    <script language="javascript"> function chk() var dd = document.getElementsByTagName("input") for(i=0;i <dd.length;i++) {   if(dd[i].type== 'checkbox' && dd[i].id != "xx"){    dd[i].checked = document.getElementById("xx").checked;  } </script><input type="checkbox" name="checkbox1" id="xx" value="checkbox"onclick="chk()" /><input type="checkbox" name="checkbox2" value="checkbox" /><input type="checkbox" name="checkbox3" value="checkbox" /><input type="checkbox" name="checkbox4" value="checkbox" /><input type="checkbox" name="checkbox5" value="checkbox" /><input type="checkbox" name="checkbox" value="checkbox" /><input type="checkbox" name="checkbox6" value="checkbox" />

    这段代码的功能是当选中第一个的时候,全部选框都会自动选中。但选中其他框的时候,正常checked

    首先解读一下checkbox的属性,checkbox.checked前面是checkbox的对象,后面的是方法,这表示这个框被选中。

    而这里的js代码中有getElementById() 也有getElementByTagName()。第一个方法通常是准确定位id名,直接找到对象。而第二个的方法则是多用来遍历对象,通过对象采取的标签名来识别。最后将遍历的对象进行条件筛选用。

    这样就可以很容易理解上面那js里面的代码意义了。

    <input type="checkbox" name="checkbox1" id="xx" value="checkbox" onclick="chk()" /> // 首先,必须选中第一个框,才会加载js脚本chk()------------------------------------------------------------------

    <script language="javascript"> function chk() var dd = document.getElementsByTagName("input") //通过标签名,找到所有用input的对象;for(i=0;i <dd.length;i++) {   if(dd[i].type== 'checkbox' && dd[i].id != "xx"){ //判断获取的对象中是checkbox控件的,而且不能是第一个选框"xx"   dd[i].checked = document.getElementById("xx").checked;//当第一个选框"xx"被选中,对象[i]也被选中。  } </script>

     

  • 相关阅读:
    简述-计算机语言的前世今生
    记一次由于引用第三方服务导致的GC overhead limit exceeded异常
    JAVA初始化及类的加载
    springboot容器启动顺序之@Configuration ContextRefreshedEvent事件初始化 ApplicationRunner
    高并发编程之发布与溢出
    编写高质量JAVA代码之让接口的职责保持单一
    Spring Boot中初始化资源的几种方式
    Thread.yeild方法详解
    JAVA基础之this关键之理解
    Django 1.10 中文文档------3.3.8 会话sessions
  • 原文地址:https://www.cnblogs.com/suizhikuo/p/2332016.html
Copyright © 2020-2023  润新知