jQuery和D3两种版本输入框长度控制

来源:互联网 发布:交行中铁网络信用卡 编辑:程序博客网 时间:2024/05/29 09:07

这个是群里的太阳神贡献。

首先将代码复制后自己添加jquery和d3的库。

<!DOCTYPE html>
<meta charset="utf-8">
<body>
<input type="text" class="c-limit" c-text-limit="13" />
<input type="text" class="c-limit" c-text-limit="3" />
<input type="text" class="c-limit" c-text-limit="5" />



<script src="d3js/d3.v3.js"></script>
<script src="jquery/jquery.js"></script>
<script>
     $("input.c-limit").on("keydown",function(d){
          if(this.value.length>(+$(this).attr("c-text-limit"))){
               $(this).value=$(this).attr("c-text-old");
          }else{
               $(this).attr("c-text-old",this.value);
          }
     }).on("keyup",function(d){
          if(this.value.length>(+$(this).attr("c-text-limit"))){
               this.value=$(this).attr("c-text-old");
          }
     })
/*
     d3.selectAll("input.c-limit").each(function(){
          d3.select(this).datum({}).on("keydown",function(d){
               if(d3.select(this).node().value.length>(+d3.select(this).attr("c-text-limit"))){
                    d3.select(this).node().value=d.text;
               }else{
                    d.text=d3.select(this).node().value;
               }
          }).on("keyup",function(d){
               if(d3.select(this).node().value.length>(+d3.select(this).attr("c-text-limit"))){
                    d3.select(this).node().value=d.text;
               }
          });

     })*/
</script>
</body>

0 0
原创粉丝点击