js知识积累

 

trim方法

function trim()
  {
      return this.replace(/(^/s*)|(/s*$)/g, "");  
  }

 

1. jQuery插件支持的转换方式

 

$.parseJSON( jsonstr ); //jQuery.parseJSON(jsonstr),可以将json字符串转换成json对象 

 

2. 浏览器支持的转换方式(Firefox，chrome，opera，safari，ie9，ie8)等浏览器：

JSON.parse(jsonstr); //可以将json字符串转换成json对象 
JSON.stringify(jsonobj); //可以将json对象转换成json对符串 

注：ie8(兼容模式),ie7和ie6没有JSON对象，推荐采用JSON官方的方式，引入json.js。 

3. Javascript支持的转换方式

eval('(' + jsonstr + ')'); //可以将json字符串转换成json对象,注意需要在json字符外包裹一对小括号 
注：ie8(兼容模式),ie7和ie6也可以使用eval()将字符串转为JSON对象，但不推荐这些方式，这种方式不安全eval会执行json串中的表达式。 

 

CSS文本超出div或者span时用省略号代替

 

.title{ 
width:200px; 
overflow:hidden; 
text-overflow:ellipsis; 
white-space:nowrap; 
word-break:keep-all; 
}
CSS Code

 

使用mouseover div和img进行切换

div上  CSS 里加上 pointer-events: none;

 

修改滚动条样式

<html>
    <head>
        <style>
            /*使用class*/
            .scrollbar::-webkit-scrollbar{
                width: 9px;
                height: 16px;
                background-color: #f5f5f5;
            }
            /*定义滚动条的轨道，内阴影及圆角*/
            .scrollbar::-webkit-scrollbar-track{
                -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
                border-radius: 10px;
                background-color: #FFFFFF;
            }
            /*定义滑块，内阴影及圆角*/
            .scrollbar::-webkit-scrollbar-thumb{
                /*width: 10px;*/
                height: 20px;
                border-radius: 10px;
                -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
                background-color: #00994D;
            }
            /*用伪类*/
            ::-webkit-scrollbar {width: 6px;height:6px;}
            ::-webkit-scrollbar-track-piece{background-color: #eee;margin: -2px;}
            ::-webkit-scrollbar-thumb{background: #aaa;min-height: 150px;min-width: 150px;border-radius: 10px;}
            ::-webkit-scrollbar-thumb:vertical:hover{background: #555555}
            ::-webkit-scrollbar-thumb:horizontal:hover{background: #555555}
        </style>
    </head>
    <body  class="scrollbar" >
        <div style="height:10000px;">
        </div>
    </body>
</html>
View Code

 

显示本地图片

        $("#File1").on("change", function () {
            var file = this.files[0];
            if (this.files && file) {
                var reader = new FileReader();
                reader.onload = function (e) {
                    $("#img1").attr('src', e.target.result);
                    $("#fn").text(file.name);
                    $("fs").text(file.size + "bytes");
                }
                reader.readAsDataURL(file);
            }
        });

        $("#deleteimg").click(function () {
            $("#File1").val('');
            $("#img1").attr('src', ' ');
            $("#fn").text('');
            $("fs").text('');
        });
View Code

 

posted @ 2019-01-28 10:29  听雨的人  阅读(130)  评论(0)  编辑  收藏  举报