zoukankan      html  css  js  c++  java
  • 零散的知识点

    最近做项目的时候,出现过一些以前没遇到的问题,基本上是解决了,为了加深记忆,把它们写到这里。

    1)一般的评论框我们都会用textarea标签,在写完标签并运行之后,可以发现这个文本框右下角有个拖拽拉长的角标,为了不让用户随意改变文本框,我们用resize: none这个属性去除它。

    2)在有很多人名的列表里,我们想要快速找到相应的人时,可以用到模糊查询的功能,代码如下:

     1 // 模糊查询
     2 function query(){  
     3     if($.trim($("#search").val()).length == 0){  
     4         $(".lock-page .aside-mid ul li, .lock-page .aside-bom ul li").show();  
     5     }else{  
     6         $(".lock-page .aside-mid ul li, .lock-page .aside-bom ul li")    
     7         .hide()    
     8         .filter(":contains('"+$("#search").val()+"')")    
     9         .show();  
    10     }  
    11 }  

    3)如何调用表情包呢?比如我们常见的qq表情、weixin表情、环信表情...等等。

    首先是要引入表情jq:<script type="text/javascript" src="js/jquery.emoji.js"></script>

    其次就是最核心的代码了

     1 $("#editor").emoji({
     2             button:"#btn-face",
     3             showTab: false,
     4             icons: [{
     5                 name: "环信表情",
     6                 path: "img/faces/",
     7                 maxNum: 35,
     8                 excludeNums: [41, 45, 54],
     9                 file: ".png",
    10                 placeholder: "{alias}",
    11         alias: {
    12             1: "[):]",
    13             2: "[:D]",
    14             3: "[;)]",
    15             4: "[:-o]",
    16             5: "[:p]",
    17             6: "[(H)]",
    18             7: "[:@]",
    19             8: "[:s]",
    20             9: "[:$]",
    21             10: "[:(]",
    22             11: "[:'(]",
    23             12: "[:|]",
    24             13: "[(a)]",
    25             14: "[8o|]",
    26             15: "[8-|]",
    27             16: "[+o(]",
    28             17: "[<o)]",
    29             18: "[|-)]",
    30             19: "[*-)]",
    31             20: "[:-#]",
    32             21: "[:-*]",
    33             22: "[^o)]",
    34             23: "[8-)]",
    35             24: "[(|)]",
    36             25: "[(u)]",
    37             26: "[(S)]",
    38             27: "[(*)]",
    39             28: "[(#)]",
    40             29: "[(R)]",
    41             30: "[({)]",
    42             31: "[(})]",
    43             32: "[(k)]",
    44             33: "[(F)]",
    45             34: "[(W)]",
    46             35: "[(D)]"
    47            
    48         }
    49         },{
    50         path: "img/faces/",
    51         file: ".png",
    52         placeholder: "#qq_{alias}#"
    53     }]
    54     });

    其中,#btn-face代表的是用户点击的按钮,#editor代表的是接收表情的文本框。

    4)监听键盘事件,同时按ctrl+enter

    1 $('#editor').keydown(function(e){
    2             if(e.which == 13 && e.ctrlKey){
    3                 add();//这里是要执行的方法
    4             }
    5         })

    5)高德地图的引入和参数设置

    <div id="wrap" class="my-map">
             <div id="map1"></div>
     </div>
                                                     <script> 
                                                            var marker, map = new AMap.Map('map1', {
                                                            resizeEnable: true, 
                                                            center: ['245.21362', '151.2546465'],
                                                            zoom: 19
                                                            });
                                                            // 实例化点标记
                                                            marker = new AMap.Marker({ 
                                                            icon: 'http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png', 
                                                            position:['245.21362', '151.2546465'] 
                                                            }); 
                                                            marker.setMap(map); 
                                                            map.on('complete', function(){ 
                                                            map.plugin(['AMap.ToolBar', 'AMap.Scale'], function(){ 
                                                            map.addControl(new AMap.ToolBar); 
                                                            map.addControl(new AMap.Scale); 
                                                            }); 
                                                            })
                                                    </script> 
  • 相关阅读:
    JavaScript函数柯里化的一些思考
    Javascript Promise 学习笔记
    ArcGIS加载高德、OSM和谷歌等地图
    抓取“矢量”的实时交通流量数据
    uniapp使用swiper组件做tab切换动态获取高度
    elementui中弹出框不能自动换行的解决方案
    前端面试题总结
    关于nodejs中的增删改查
    关于cookie与本地 存储的区别的问题。
    微信小程序实现如丝顺滑可移动悬浮按钮(超简单)
  • 原文地址:https://www.cnblogs.com/cyppi/p/6080542.html
Copyright © 2011-2022 走看看