www.qjdy.com-奇迹赌场 > www.qjdy.com > name="mm"也要设置一样

原标题:name="mm"也要设置一样

浏览次数:138 时间:2019-07-15

演示八个微小的事例:在购物车上面,大家可以勾选自身所选的货色,然后能够显得出相应的价格。
1、首先彰显出相应的分界面:

图片 1 

连带代码:

<body> 
  商品列表:<br/> 
  笔记本电脑<input type="checkbox" name="mm" value="3000" onclick="chose(this)" />3000 
  台式机<input type="checkbox" onclick="chose(this)" name="mm" value="2900"/> 2900 
  路由器<input type="checkbox" onclick="chose(this)" name="mm" value="90"/> 90 
  <br/> 
  家常用品<input type="checkbox" onclick="chose(this)" name="mm" value="500"/>500 
  洗衣机<input type="checkbox" onclick="chose(this)" name="mm" value="5600"/> 5600 
  <br/>全选<input type="checkbox" name="all" onclick="allCheck(this)" /> 
  <br/><input type="button" value="查看金额" name="btn" onclick="sumall()"/>  

 </body> 

留神:在checkbox中,即便属于同一组的,在复选框的习性内name="mm"属性要写同样;到时候方便遍历所选项;在radio中,name="mm"也要安装同一,便于属于同一组相互区分。
2、全选开关的安装

图片 2

连带代码:

function allCheck(node1){ 
    var node=document.getElementsByName("mm"); 
    for (var x = 0; x < node.length; x  ) { 
     node[x].checked=node1.checked; 
    } 
   } 

附加:当调用全选<input type="checkbox" name="all" onclick="allCheck(this)" />里面包车型客车函数之后就能遍历全体name一样的靶子,设置富有的复选框的情景为checked=true选中。
3、当有着的景色都入选全选自动选上 代码实现:

function chose(node){ 
    var flag=true;//用于遍历是否是全部变量设置 
    var allM=document.getElementsByName("all")[0]; 
    var node=document.getElementsByName("mm"); 
    for (var x = 0; x < node.length; x  ) { 
     if(node[x].checked==false){//只要有一个没选中,就退出遍历,标记设置为false 
      flag=false; 
      break; 
     } 
    } 
    if(flag){ 
     allM.checked=true; 
    }else{ 
     allM.checked=false; 
    } 
   } 

4、点击查阅开关之后调用函数

function sumall(){ 
    var sum=0; 
    var names=document.getElementsByName("mm"); 
    for(var x=0;x<names.length;x  ){ 
     if(names[x].checked){//选中的全部加起来 
      sum=sum parseInt(names[x].value);//将选中的值解析出来 
     } 
    } 
    document.getElementById("spanid").innerHTML=("总和为 " sum " 元").fontcolor("red"); 

   } 

图片 3 

总结:
1).那一个根本正是,复选框的运用,选中复选框之后,怎么样获取相应的剧情

2).假使属于同一组的,在复选框的属性内name="mm"属性要写一致;

var names=document.getElementsByName("mm");能够由此那么些获得,是不是选中,调用value实行操作checked 设置或取得复选框或单选钮的情形。 然后一一 加起来

3).全选的装置。一样的,通过document.getElementsByName获得对象数组,然后每家每户付给true

当多个并未有入选的时候,咱们就把全选按键设置checked=false; 选用标识来分别,假使标志未有变化,就证实未有三个没选(那句话有些绕口,大家精心雕刻讨论)。

如上为大家详细介绍了javascript中checkbox使用格局,应接我们学习。

您恐怕感兴趣的稿子:

  • js点击文本框弹出可挑选的checkbox复选框
  • JS完成CheckBox复选框全选、不选或全不选功力
  • 基于javascript完成checkbox复选框实例代码
  • javascript落到实处checkbox复选框实例代码
  • js与jQuery实现checkbox复选框全选/全不选的诀窍
  • javascript动态增加checkbox复选框的措施
  • javascript中checkbox使用办法实例演示
  • js获取具备checkbox的值的简练实例

本文由www.qjdy.com-奇迹赌场发布于www.qjdy.com,转载请注明出处:name="mm"也要设置一样

关键词: GD视讯直播

上一篇:一、EasyUI创建简单的菜单

下一篇:没有了