自己学js代码常用（三）

文件上传--input文件上传按钮小技巧

  

<button type="button" onclick="$(this).next().click()" >点击上传招标文件</button>
<input type="file" id="inputfile" style="display:none">
<span id="em"></span>


<script type="text/javascript">
    //    文件名的传递 ---全路径获取
    //    $('#inputfile').change(function () {
    //        $('#em').text($('#file').val());
    //    });
    //    文件名的传递 ---只获取文件名
    var file = $('#inputfile'),
        aim = $('#em');
    file.on('change', function (e) {
        console.dir(e.currentTarget.files);//通过这个查看选择的内容东西
        //e.currentTarget.files 是一个数组，如果支持多个文件，则需要遍历
        var name = e.currentTarget.files[0].name;
        aim.text(name);
    });

</script>

日历选择--bootstrap日历选择插件

<div class="form-group">
     <label class="col-sm-2 control-label">
         <span style="color: red;font-size: 14px">*</span>日期
     </label>
     <div class="col-sm-5">
          <div class='input-group date' id='datetimepicker1'>
                <input type='text' class="form-control"/>
                <span class="input-group-addon bg_fff"><span class="glyphicon glyphicon-calendar"></span></span>
           </div>
     </div>
</div>

//js部分
//添加 datetimepicker插件
<script src="js/bootstrap-datetimepicker.min.js"></script>
<script>
    $(function () {
        $('#datetimepicker1').datetimepicker({
            format: 'YYYY-MM-DD',
            locale: moment.locale('zh-cn')
        });
    });
</script>


//要源码留言

js-sessionStorage的存储-可以简单实现静态页面跳转传值（字符串）

存： sessionStorage.setItem("id",1);
取： var id = sessionStorage.getItem("id");

字符串进行编码，这样可以提高读写速度

escape("哈哈哈哈")
输出   "%u54C8%u54C8%u54C8%u54C8"

unescape("%u54C8%u54C8%u54C8%u54C8")
输出   "哈哈哈哈"

可以使用 unescape() 对 escape() 编码的字符串进行解码。这样可以提升页面的加载速度

表单验证--常用正则表达式

人名 = /^[\u4E00-\u9FA5]{2,6}$/;  //因为人名可以取值2到6个字符

QQ账号的正则表达式 =/^\d{5,10}/;  //5-10位数字  或者[1-9][0-9]{4,} 4位以上的qq

邮箱 =/^[0-9a-zA-Z_.-]+[@][0-9a-zA-Z_.-]+([.][a-zA-Z]+){1,2}$/;  
或者邮箱也可以这么写 = /^\w+@\w+\.\w+$/

匹配中国邮政编码：[1-9]\d{5}(?! \d) 或 [1-9]{1}(\d+){5}

手机号 var myreg=/^[1][3,4,5,7,8][0-9]{9}$/; 

匹配身份证：\d{15}|\d{18}
//身份证正则表达式(15位)
isIDCard1=/^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$/;
//身份证正则表达式(18位)
isIDCard2=/^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/;
身份证正则合并：(^\d{15}$)|(^\d{17}([0-9]|X)$)

匹 配ip地址：\d+\.\d+\.\d+\.\d+

提取信息中的网络链接:(h|H)(r|R)(e|E)(f|F) *= *('|")?(\w|\\|\/|\.)+('|"| *|>)?
提取信息中的邮件地址:\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*
提取信息中的图片链接:(s|S)(r|R)(c|C) *= *('|")?(\w|\\|\/|\.)+('|"| *|>)?
提取信息中的IP地址:(\d+)\.(\d+)\.(\d+)\.(\d+)
提取信息中的中国电话号码（包括移动和固定电话）:(\(\d{3,4}\)|\d{3,4}-|\s)?\d{7,14}
提取信息中的中国邮政编码:[1-9]{1}(\d+){5}
提取信息中的中国身份证号码:\d{18}|\d{15}
提取信息中的整数：\d+
提取信息中的浮点数（即小数）：(-?\d*)\.?\d+
提取信息中的任何数字 ：(-?\d*)(\.\d+)?
提取信息中的中文字符串：[\u4e00-\u9fa5]*
提取信息中的双字节字符串 (汉字)：[^\x00-\xff]*

判断字符串是否为空
if (textValue.length==0||textValue==""||new RegExp("^[ ]+$").test(textValue)) {
            alert("为空");
       return false;
} else {
       return true;
}

js 监听滚动事件

1) window.onscroll = function() {e}

2) document.addEventListener("onscroll", function (e) {})

js-jquery委托事件--有时候添加一些节点之后，没有点击事件，可以通过委托的方式添加事件，或者class

$("div").delegate("button","click",function(){
  $("p").slideToggle();
});