[JS]: JS 常用事件及属性

1. CheckBox event:

    html: <input type="checkBox" id="demoCbx" name="demoCbx" style="#" class="#">
          <label for="checkBox" style="#" class="#">demo checkBox</label>
        
    JS: $(document).on("click","[name='demoCbx']",function(){
      if($("#demoCbx").is(":checked"){
        // TODO checked
      }else{
        // TODO unchecked
      }
    });
    

2. Radio event:

   html: <input type="radio" id="maleRdo" name="gender" value="M" style="#" class="#" οnclick="radioChange(this)">
         <label for="maleRdo" style="#" class="#">Male</label>
         <input type="radio" id="femaleRdo" name="gender" value="F" style="#" class="#" οnclick="radioChange(this)">
         <label for="femaleRdo" style="#" class="#">Female</label>
        
   JS:     
     a) var radioChange = function(obj){
          var value = obj.value;
          if(value === "M"){
            // TODO male check
          } else{
            // TODO female check
          }
        };
    
     b) $(document).on("click","[name='gender']",function(obj){
          var value = $('input:radio[name="gender"]:checked').val();
          if(value === "M"){
            // TODO male check
          } else{
            // TODO female check
          }
        });
        

3. Remove or add attribute under an area

   html: <div id="demodiv">
           <input type="text" id="demoInput1">
           <input type="radio" id="demoInput2">
           <input type="file" id="demoInput3">
           <input type="file" id="demo4">
           // ...
         </div>
        
   JS:  
        // demodiv 里所有input标签添加 disabled属性
        $("#demodiv").find("input").attr("disabled":"disabled");
        // demodiv 里所有input标签移除 disabled属性
        $("#demodiv").find("input").removeAttr("disabled");
        // demodiv 里一共有几个input标签
        $("#demodiv").find("input").length;
        // demodiv 里一共有几个命名以 demoInput开头的input标签
        $("#demodiv").find("input[name^='demoInput']").length
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值