博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
代码片段
阅读量:6832 次
发布时间:2019-06-26

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

1 获取屏幕高度与宽度

var h = document.documentElement.clientHeight || document.body.clientHeight;复制代码

var k = document.documentElement.clientWidth || document.body.clientWidth复制代码

2 swiper轮播

html              
复制代码

jsvar swiper = new Swiper(".swiper-container", {        autoplay: {          delay: 3000,          stopOnLastSlide: false,          disableOnInteraction: true        },        loop: true,        autoplayDisableOnInteraction: false,        pagination: {          el: ".swiper-pagination"        },        effect: "fade",        fade: {          crossFade: true        }      });复制代码

引入swiper的css和js

3 监听浏览器变化

$(window).resize(function() { 函数内容 }复制代码

4 判断是否是pc

function IsPC() {        var userAgentInfo = navigator.userAgent;        var Agents = [          "Android",          "iPhone",          "SymbianOS",          "Windows Phone",          "iPad",          "iPod"        ];        var flag = true;        for (var v = 0; v < Agents.length; v++) {          if (userAgentInfo.indexOf(Agents[v]) > 0) {            flag = false;            break;          }        }        return flag;      }复制代码

5 输入框不允许输入负值(购物车)

(parseInt((select_arr[s].goods_count.replace(/\D/g,''))==''||parseInt((select_arr[s].goods_count.replace(/\D/g,''))==0)?'1':select_arr[s].goods_count,10))(parseInt((需要判断的值.replace(/\D/g,''))==''||parseInt((需要判断的值.replace(/\D/g,''))==0)?'1':需要判断的值,10))复制代码

6 小程序的横向滚动

xml

服装
服装服装
服装
服装
服装服装
服装
服装
服装服装
服装
服装
服装服装
服装
服装服装
服装
服装服装
服装
服装
服装服装
复制代码

css

.head_list{  display: flex;  justify-content: flex-start;  flex-wrap: nowrap;  flex-direction: row;  align-items: center;  height: 100rpx;}.head_item{  display: inline-block;  color: #333;  border-bottom: 1rpx solid transparent;  font-size: 32rpx;  text-align: center;  line-height: 90rpx;  padding: 0 15rpx}.head_item_act{  color: #01c885;  border-bottom: 1rpx solid #01c885}复制代码

注意点:

1 scroll-view 设置为横向滑动scroll-x="true"

2 scroll-view的css要设置为 white-space: nowrap,不换行

不要用 display: flex;,这样可能存在兼容问题,在android手机上可能滑动不了

3 scroll-view的子节点的css要设置为 display: inline-block;不然可能显示有问题

4 去除横向滚动条,如果要禁用横向滚动条的显示需要在page界面的样式布局里面加上,不要在组件或者模块的样式布局里面加

::-webkit-scrollbar {    width: 0;    height: 0;    color: transparent;}复制代码

图片

7 数组添加元素

var arr = [1,2,3]arr = arr.push(4)console.log(arr)    4arr.push(4) console.log(arr)    [1,2,3,4]复制代码

arr.push() 返回的是数组的长度,而不是新数组

8 $(this).hide() 与$(this).remove()

hide()如果被选的元素已被显示,则隐藏该元素。

remove() 方法移除被选元素,包括所有文本和子节点。

该方法不会把匹配的元素从 jQuery 对象中删除,因而可以在将来再使用这些匹配的元素。

但除了这个元素本身得以保留之外,remove() 不会保留元素的 jQuery 数据。其他的比如绑定的事件、附加的数据等都会被移除。

在写jQuery扩展的时候需要遇到这个问题:在页面第一次自己的代码的时候数据完整(页面动态添加的下拉框数据添加正确)

在第二次执行js时候,console.log()可以打印正确的数据,但是页面的下拉框没有动态添加数据。

原因在与 我使用了hide隐藏节点,修改为remove移除节点的时候页面正常执行。

8 截取字符串

var meeting_id=getQueryVariable("id");   链接中的参数名是id      //获取参数    function getQueryVariable(variable)    {        var query = window.location.search.substring(1);        var vars = query.split("&");        for (var i=0;i

8 for循环 

遍历数组中的对象 只要有一个对象的值为空 就跳出循环 

var arr = [        {          name: "zhangsan",          age: "18"        },        {          name: "zhaoliu",          age: "13"        },        {          name: "zhaoliu",          age: "12"        },        {          name: "zhaoliu",          age: "19"        }      ];      // console.log(arr)      var flag = true;      for (var i = 0; i < arr.length; i++) {                for (x in arr[i]) {          if (arr[i][x] == "") {            flag = false;            break;          }        }        if (flag == false) {          break;        }        console.log(11);      }      if(flag){        console.log('执行函数')      }else{        console.log('放弃')      }      //arr[i].x //打印是undefined      //arr[i][x] // 打印是对象的值复制代码

9 vue中的a链接渲染

需要的href加:

:href="';new_content.html?article_id=';+item.essay_id"复制代码

:href="'链接'+参数"复制代码

10 文件的命名

最好不要用点命名

job.detail 会出错 js可以正常使用 但是在有些代码是不会执行复制代码

job_detail jobDetail 最好复制代码

11 concat链接数组

直接将两个数组连接 如果在后台拿到数据最好不要使用  .  的拿取数据的方式获取数组然后连接数组,最好将需要连接的两个数组各自直接使用变量赋值然后连接

var arr = 原数组;        var _r = 新数组数据;        var _c = arr.concat(_r); 连接        原数组 = _c;  数组赋值复制代码

/**   *    * @param {*} old_r 原有数组   * @param {*} new_r 新数组 需要连接到原有数组之上   */  _Arr_concat(old_r,new_r){    var arr = old_r;    var _r = new_r;    var _c = arr.concat(_r);    old_r = _c;    console.log('连接数组')    return old_r  },复制代码

12 ul li

修改 列表的圆圈样式

ul li {  content: ".";  color: #3b63a6;}复制代码

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

你可能感兴趣的文章
Java Decompiler反编译工具安装
查看>>
各种数据库连接配置
查看>>
Altium_Designer-PCB中布局元器件时的翻转问题
查看>>
C++虚成员函数表vtable
查看>>
WebStorm 配置微信小程序开发 用html样式打开wxml 用css样式打开wxss 配置微信小程序提醒...
查看>>
svn执行update,却被告知database is locked
查看>>
Okhttp实用封装
查看>>
Python多线程、多进程实现
查看>>
倒排索引与ElasticSearch
查看>>
JSP显示不完全问题
查看>>
OpenCV+VS2010+MFC 静态链接 显示一张图片(使用CvvImage)
查看>>
Linux之用户和组账户管理
查看>>
python_selenium自动化测试之等待时间
查看>>
详解 IntelliJ IDEA 配置和启动maven 项目 步骤
查看>>
SQL Server @@ERROR的小误区大Bug
查看>>
Git超实用总结
查看>>
Java 回调机制的理解
查看>>
POJ 1017
查看>>
linux 定时任务
查看>>
***PHP各种编码的汉字字符串截取
查看>>