博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
实用的JS代码段(表单篇)
阅读量:6111 次
发布时间:2019-06-21

本文共 1779 字,大约阅读时间需要 5 分钟。

整理了下比较实用的Javascript代码段,

1 多个window.onload方法

  由于onload方法时在页面加载完成后,自动调用的。因此被广泛的使用,但是弊端是只能实用onload执行一个方法。下面代码段,可以保证多个方法在Onload时执行:

function addLoadEvent(func){        var oldonload = window.onload;        if(typeof window.onload != 'function'){            window.onload = func;        }else{            window.onload = function(){                oldonload();                func();            }        }    }

2 正则表达式去空格

str.replace(/^(\s|\u00A0)+|(\s|\u00A0)+$/g,"");

3 利用正则过滤中文

str.replace(/[\u4e00-\u9fa5]/g,"");

4 禁止用户的拷贝和复制

xxx.oncopy = function(){    return false;}xxx.onpaste = function(){    return false;}

5 限制字符串长度(区分中英文)

  主要思想:

  需要3个数据:1 限制输入的长度;2 已经输入了多长; 3 截取多少个字符;

  由于JS里面的截取方法不区分中英文 ,因此

  “哈哈哈”.substr(0,2) ----> 哈哈

  “haha”.substr(0,2) ---> ha

  但是,如果按照编码一个汉字应该对应2个字符,一个字母对应一个字符。

  因此统计 真实长度 时,应该是 字符的长度 + 汉字的个数 

  例如我们限制输入5个字符:那么输入“哈哈”后,就只能输入一个h,不能再输入汉字了。代码参考如下,可以运行一下推敲推敲。 

  全部代码

    

(支持中英文区分)限制字符串长度


View Code

6 添加CSS函数

var setCSS = function(_this,cssOption){    if(!_this || _this.nodeType === 3 || _this.nodeType === 8 || !_this.style){        return;    }    for(var cs in cssOption){        _this.style[cs] = cssOption[cs];    }    return _this;};

  使用时

setCSS(xxx,{    "position":"relative",    "top":"0px"});

7 自适应文本框

  采用scrollHeight复制给style.height

xxx.style.overflowY = "hidden";xxx.onkeyup = function(){    xxx.style.height = xxx.scrollHeight+"px";};

8 复选框全选、取消和反选

//下面html代码//下面是js代码var targets = document.getElementsByName("actionSelects");var targetsLen = targets.length;var i = 0;document.getElementById("allSelect").onclick = function(){    for(i=0;i

参考

【1】《超实用的JavaScript代码段》

转载地址:http://tkcka.baihongyu.com/

你可能感兴趣的文章
cocos2d-x Schedule详解
查看>>
sdut 2163:Identifiers(第二届山东省省赛原题,水题)
查看>>
C++ 容器:顺序性容器、关联式容器和容器适配器
查看>>
mysql 常用语句集
查看>>
Atitit.软件开发提升稳定性总结
查看>>
lftp查看文件时间与登录服务查看文件时间相差8小时
查看>>
[leetcode]Next Permutation @ Python
查看>>
JAVA(2)——JDBC
查看>>
php heredoc 与 nowdoc
查看>>
DBA_Oracle DBA常用表汇总(概念)
查看>>
第30周二
查看>>
数学类杂志SCI2013-2014影响因子
查看>>
实用的树形菜单控件tree
查看>>
最近公共祖先(lca)
查看>>
【WP 8.1开发】文件选取器的使用方法
查看>>
Java实现BASE64编解码
查看>>
【Java】java基本知识
查看>>
之前学习wordpress的几张图片
查看>>
RT-Thread下的串口驱动程序分析【转载】
查看>>
UITableView的UITableViewStyleGrouped
查看>>