Skip to content

Instantly share code, notes, and snippets.

@337547038
337547038 / 常用js整理
Last active November 4, 2022 00:51
常用js整理
//获取Url中的参数值
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) {
return r[2];
}
else {
return "";
}
@337547038
337547038 / jquery插件封装几种方法
Created November 24, 2017 03:27
jquery插件封装几种方法
1.jquery插件封装方法1:
(function ($) {
$.fn.extend({
test:function (opt) {
opt=jQuery.extend({
name:'name'
},opt)
//这里是实现代码
}
})
@337547038
337547038 / 移动端H5和App端输入框被键盘挡住解决方法
Created November 24, 2017 03:28
移动端H5和App端输入框被键盘挡住解决方法
在移动端的开发中,页面中使用了如iScroll或者是Swiper等插件用于滚屏时,在安卓手机弹机的键盘往往会挡住输全入框,使得无法正常输入
实现方法是在输入框取得焦点时,监听resize事件,将当前页面往上移动一定的距离
var u = navigator.userAgent;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
if (isAndroid) {
var show = false;
var offsetTop = 0;
var wh = $(window).height();
//取得焦点时
$(".input-focus").focus(function () {
@337547038
337547038 / jquery循环滚动效果
Created November 24, 2017 03:28
jquery循环滚动效果
//jquery焦点图插件百度其实是很多很多的,只是很多时候还是不能满足项目的需求,这是一款可以循环滚动效果,支持图片及文字混排
//主要样式
/*.slides{ width: 750px; height: 500px; position: relative; overflow: hidden; margin: 0 auto }
.scroll{ width: 1000%; position: relative; }
.scroll:after{ content: ''; clear: both; display: block; visibility: hidden }
.scroll .item{ float: left; width: 200px; height: 400px; background: #42b983; margin-top: 50px; }
.scroll .item.active{ width: 350px; height: 500px; margin-top: 0; background: #ddd }
html结构
<div class="slides">
@337547038
337547038 / jquery图片垂直水平居中
Created November 24, 2017 03:29
jquery图片垂直水平居中
;(function ($) {
$.fn.extend({
imgHook: function (opt) {
opt = jQuery.extend({className: "img-hook"}, opt);
var th = $(this);
if (th.length > 0) {
if (th[0].tagName == 'IMG') {
th.wrap('<div class="' + opt.className + '"></div>');
th.before('<b class="hook"></b>')
} else {
1、npm install --save-dev sass-loader node-sass
2、build/webpack.base.conf.js添加loader;
   {
test: /\.scss$/,
loader: 'style!css!sass?sourceMap'
}
3、在App.vue里引入;
  <style lang="scss">
  @import "sass/index.scss";
  </style>
@337547038
337547038 / calendar日期插件
Created March 6, 2018 07:44
calendar日期插件
;(function ($) {
$.fn.extend({
calendar: function (opt) {
opt = jQuery.extend({
year: "",
month: "",
date: "",
//prevClick: "",
// nextClick: "",
dayClick: ""
@337547038
337547038 / 获取浏览器URL参数
Created March 12, 2018 06:41
获取浏览器URL参数
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) {
return r[2];
}
else {
return "";
}
}
@337547038
337547038 / 获取隐藏元素的宽高
Last active March 28, 2018 14:45
获取隐藏元素的宽高
/**
* 获取隐藏元素的宽高
* @param {Object} obj
*/
function getDomWidthOrHeight(widthOrHeight,obj){
//console.log(widthOrHeight+"="+obj);
var clone=obj.cloneNode(true);
clone.style.display="block";
clone.style.position="absolute";
@337547038
337547038 / Vue中v-model无法动态更新对象数组问题数据
Created March 29, 2018 07:15
Vue中v-model无法动态更新对象数组数据问题
大致代码如下:
<input type='text' v-model='value'>{{value}}
data(){
return {
value:['1','2']
}
},
methods:{
test(){
this.value[0]='3';