Tampermonkey一款免费的浏览器扩展

Tampermonkey 是一款免费的浏览器扩展和最为流行的用户脚本管理器,它适用于Chrome,Microsoft Edge,Safari,Firefox,Opera Next,Dolphin Browser,UC Browser.
虽然有些受支持的浏览器拥有原生的用户脚本支持,但 Tampermonkey 将在您的用户脚本管理方面提供更多的便利。 它提供了诸如便捷脚本安装、自动更新检查、标签中的脚本运行状况速览、内置的编辑器等众多功能, 同时Tampermonkey还有可能正常运行原本并不兼容的脚本。
官网地址:
http://tampermonkey.net
脚本地址:
https://greasyfork.org/zh-CN

小程序开发问题"找到入口 app.json 文件,或者文件读取失败,请检查后重新编译。"

小程序开发问题"找到入口 app.json 文件,或者文件读取失败,请检查后重新编译。"

通常这种情况是因为在小程序目录中缺少配置文件project.config.json造成的.

只需要在修改一下工具中的详情信息即可.

同时查看project.config.json中是否有指定小程序目录

"miniprogramRoot": "./",

或者在app.json中添加一行配置小程序目录参数即可
{
"miniprogramRoot": "./",
"pages":[
"pages/index/index",

 

小程序swiper的高度自适应

原理

图片加载完之后,获取图片的原始宽高,根据宽高比,计算出适应后的宽高,如果是适应屏幕宽度的话,就用到 wx.getSystemInfo() 方法设备的信息,并保存到一个数组中,(因为加载的原因不能用push,只能根据索引),切换时监听当前显示的图片,根据其索引找到对应的高度,并赋值给组件即可。

 

wxml

<view class='swiper'>
<swiper indicator-dots="{{indicatorDots}}" vertical="{{vertical}}" autoplay="{{autoplay}}" duration="{{duration}}" interval='{{interval}}' bindchange="bindchange" circular="{{circular}}" style="height:{{imgheights[current]}}rpx;">
<block wx:for='{{imgList}}' wx:key="{{index}}">
<swiper-item>
<image src="{{item}}" data-id='{{index}}' class="slide-image" mode="widthFix" bindload="imageLoad"/>
</swiper-item>
</block>
</swiper>
</view>

wxss

.swiper image {
width: 100%;
height: auto;
}

js

data: {
//图片地址
imgList: ['/images/wyh-img_bg.png', '/images/wyh-img8.png', '/images/wyh-img_shop1.png', '/images/wyh-img_bg1.png'],
//是否采用衔接滑动
circular: true,
//是否显示画板指示点
indicatorDots: false,
//选中点的颜色
indicatorcolor: "#000",
//是否竖直
vertical: false,
//是否自动切换
autoplay: true,
//自动切换的间隔
interval: 2500,
//滑动动画时长毫秒
duration: 100,
//所有图片的高度
imgheights: [],
//图片宽度
imgwidth: 750,
//默认
current: 0
},
imageLoad: function (e) {//获取图片真实宽度
var imgwidth = e.detail.width,
imgheight = e.detail.height,
//宽高比
ratio = imgwidth / imgheight;
console.log(imgwidth, imgheight)
//计算的高度值
var viewHeight = 750 / ratio;
var imgheight = viewHeight;
var imgheights = this.data.imgheights;
//把每一张图片的对应的高度记录到数组里
imgheights[e.target.dataset.id] = imgheight;
this.setData({
imgheights: imgheights
})
},
bindchange: function (e) {
// console.log(e.detail.current)
this.setData({ current: e.detail.current })
},

 

来源

https://www.cnblogs.com/wangyihong/p/8610956.html

js实现tab切换,支持单页面多个调用

js代码部分

 

<script>
<!--
function setTab(name,cursel,n){
for(i=1;i<=n;i++){
var menu=document.getElementById(name+i);
var con=document.getElementById("con_"+name+"_"+i);
menu.className=i==cursel?"hover":"";
con.style.display=i==cursel?"block":"none";
}
}
//-->
</script>

 

html部分
<div id="Tab1">
<div class="Menubox">
<ul>
<li id="one1" onmouseover="setTab('one',1,4)" class="hover">新闻1</li>
<li id="one2" onmouseover="setTab('one',2,4)" >新闻2</li>
<li id="one3" onmouseover="setTab('one',3,4)">新闻3</li>
<li id="one4" onmouseover="setTab('one',4,4)">新闻4</li>
</ul>
</div>
<div class="Contentbox">
<div id="con_one_1" class="hover">新闻列表1</div>
<div id="con_one_2" style="display:none">新闻列表2</div>
<div id="con_one_3" style="display:none">新闻列表3</div>
<div id="con_one_4" style="display:none">新闻列表4</div>
</div>
</div>

其中onmouseover为鼠标移动到选项卡切换,如需点击切换,请修改为onclick

 

css部分自理

 

小程序APP方法使用步骤

在app.js中注册

//app.js
App({
onLaunch: function(options) {
console.log("onLaunch");
},
onShow: function(options) {
console.log("onShow");
// Do something when show.
},
onHide: function() {
console.log("onHide");
// Do something when hide.
},
onError: function(msg) {
console.log(msg)
},
test:function() {
console.log("I am func from App.js");
},
globalData: {
userInfo:null,
url: 'https://wdja.cn/api.php'
}
})

在index.js中使用

两种方法

var app = getApp();

onLoad: function () {
var that = this
wx.request({
url: app.globalData.url,
.......

app.test(); // 调用全局方法

或直接

onLoad: function () {
var that = this
wx.request({
url: getApp().globalData.url,

.....

getApp().test(); // 调用全局方法

 

微信小程序image图片自适应的方法

 

一.使用mode属性

mode:widthFix

<image class="img" src="/hello.png" mode="widthFix">

.img{
  width: 100%;
}
.img{
  width: 100rpx;
}
二.用bindload绑定函数js处理
<image src="{{%20item%20}}" bindload="imageLoad" data-index="{{ index }}"
style="width:{{ images[index].width }}rpx; height:{{ images[index].height }}rpx;"></image>
Page({
data: {
images:{}
},
imageLoad: function(e) {
var $width=e.detail.width, //获取图片真实宽度
$height=e.detail.height,
ratio=$width/$height; //图片的真实宽高比例
var viewWidth=718, //设置图片显示宽度,左右留有16rpx边距
viewHeight=718/ratio; //计算的高度值
var image=this.data.images;
//将图片的datadata-index作为image对象的key,然后存储图片的宽高值
image[e.target.dataset.index]={
width:viewWidth,
height:viewHeight
}
this.setData({
images:image
})
}
})

PHPStudy遇到80端口被占用的解决思路及方法

PHPStudy遇到80端口被占用的解决思路及方法

通过phpstudy的环境端口检测,在端口列表中查看80端口占用的进程.

如果不是system占用,则找到对应的软件停用即可解决.

如果是system占用,则通过以下方法来解决:

停用IIS/或卸载IIS

禁用服务(iisadmin和World Wide Web Publishing Service)

修改注册表HKEY_LOCAL_MACHINESYSTEMCurrentControlSetservicesHTTP,在右边找到Start这一项,将其改为0

SqlServer版本的配置工具中打开Reporting Services 配置管理器,停止占用80端口的报表服务Reporting Service)或者服务中找到SQL Server Reporting Services (MSSQLSERVER),禁用即可.防止开机后重新启动.

以上为PHPStudy遇到80端口被占用的解决思路及方法,如果还无法解决,建议修改phpstudy的端口来解决.

phpStudy中 phpmyadmin 报错 #2002 无法登录 MySQL 服务器

windows xp/2003/vista/2008/7/8用户请先排查HOSTS文件(c:windowssystem32driversetc)中

127.0.0.1 localhost

是否有以上一行IP指向.

有如下2种方式:

1.将phpMyAdmin中的config.sample.inc.php复制成config.inc.php编辑config.inc.php文件,

将$cfg[‘Servers’][$i][‘host’] = ‘localhost';
改为$cfg[‘Servers’][$i][‘host’] = ‘127.0.0.1’;
2.修改php配置目录中的, php.ini : mysql.default_socket = /tmp/mysql.sock
以上方式选一即可。
建议第一种.