• 当前标签：js

程序开发 vue 中对城市列表根据首字母进行排序

vue中根据城市的首字母a-z进行排序 先安装 js-pinyin 依赖: npm i --save js-pinyin 然后在组件中引入： import pyjs from 'js-pinyin' export default { async mounted() { let city = [ { name: '北京' }, { name: '上海' }, { name: '广州' }, { name: '武汉' }, { name: '浙江' }, { name: '海口' } ] // 城市列表 let blocks = [] // 新列表 let p, c let d = {} city.forEach(item => { p = pyjs.getFullChars(item.name).toLocaleLowerCase().slice(0, 1) c = p.charCodeAt(0) // charCodeAt() 方法可返回指定位置的字符的 Unicode 编码。这个返回值是 0 - 65535 之间的整数。 if (c > 97 && c < 123) { // 小写的 a-z if (!d[p]) { d[p] = [] } d[p].push(item.name) } }) for(let [k, v] of Object.entries(d)) { blocks.push({ title: k.toUpperCase(), city: v }) } blocks.sort((a, b) => a.title.charCodeAt(0) - b.title.charCodeAt(0)) console.log(blocks) // 得出结果 } }

2018-12-14 11:11:34 911 0 0
阅读详情

程序开发 JS原生滚动到指定元素位置

使用JS原生API Element.scrollIntoView() ；（有部分浏览器不支持） https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollIntoView Element.scrollIntoView() 方法让当前的元素滚动到浏览器窗口的可视区域内。 element.scrollIntoView(); // 等同于element.scrollIntoView(true) element.scrollIntoView(alignToTop); // Boolean型参数 element.scrollIntoView(scrollIntoViewOptions); // Object型参数 参数 alignToTop 一个Boolean值： 如果为true，元素的顶端将和其所在滚动区的可视区域的顶端对齐。 如果为false，元素的底端将和其所在滚动区的可视区域的底端对齐。 scrollIntoViewOptions 一个boolean或一个带有选项的object： { behavior: "auto" | "instant" | "smooth", block: "start" | "end", } 如果是一个boolean, true 相当于{block: "start"}，false 相当于{block: "end"}

2018-06-12 16:38:31 752 2 0
阅读详情

程序开发 paging.js插件翻页

在需要添加分页的地方添加以下html代码： <div id="page"></div> js代码： $("#page").paging({         pageNo: that.page, // 传入初始         totalPage: that.totalPage, //传入总页数         totalSize: that.pageSize,         callback: function (num) {             // 回调页数             // console.log(num)             $.ajax({                 url: `{:url('api/Details/getTeamcaselist')}?id=${that.id}`,                 type: "post",                 data: {                     page: num                 },                 success: function (res) {                     // console.log(res)                     if (res.status == 200) {                         that.dList = res.res;                     } else {                         alert('没有数据');                     }                 }             })         }     })

2018-01-16 10:42:45 189 0 0
阅读详情

程序开发 js点击复制文字或链接方法

js点击复制一段文字或者链接： $('#btn').click(function(e){     let url = e.currentTarget.dataset.url;     $("body").after("<textarea cols='1' rows='1' id='copyContent'>" + url + "</textarea>");     let link = document.getElementById("copyContent");     link.select(); // 选择对象      document.execCommand("Copy");     $("#copyContent").remove();     alert('复制成功'); })

2018-01-02 10:24:28 261 0 0
阅读详情

程序开发 鼠标向上、向下滚动时执行事件

原理：拿当前的scrollTop和之前的scrollTop对比 如果变大了，表示向下滚动（scrollTop值变大）； 如果变小了，表示向上滚动（scrollTop值变小）。 $(document).ready(function(){     var p=0,t=0;     $(window).scroll(function(e){             p = $(this).scrollTop();             if(t<=p){               console.log('下滚')             }             else{                console.log('上滚')             }             setTimeout(function(){t = p;},0);     }); });

2017-12-22 13:58:33 155 4 0
阅读详情

程序开发 文字滚动效果

在网络上找到的这个效果，核心代码： <script type="text/javascript">     function autoScroll(obj) {         $(obj).find("ul").animate({             marginTop: "-39px"         },         500,         function() {             $(this).css({                 marginTop: "0px"             }).find("li:first").appendTo(this);         })     }     $(function() {         setInterval('autoScroll(".maquee")', 3000);         setInterval('autoScroll(".apple")', 2000);     }) </script> 演示Demo

2017-12-21 11:20:36 152 1 0
阅读详情
  • 1
前往
页

公告

关注公众号

微信公众号：HLB_Blog

由于中文域名续费比较贵，所以域名逐渐转为huangliangbo.com

中文域名访问截止时间2023-12-23

最新评论

站点统计

  • 标签：582个
  • 文章：373篇
  • 页面：3个
  • 评论：349条
  • 分类：5个
  • 最后更新：2020-6-2

标签云

更多