Description of the exception :

ios System mobile phone access h5 page , There's a delay when you click the button , Continuous click on carton 、 No response .

Abnormal reason :

It goes back to 2007 Beginning of the year . Apple is releasing its first iPhone On the eve of , There's a problem : At that time, websites were designed for large screen devices . So Apple's engineers made some agreements , Answer iPhone This kind of small screen browsing desktop site problems . The most famous , Double click zoom (double tap to zoom), This is also the case 300 The main reason for millisecond delay . Double click zoom , seeing the name of a thing one thinks of its function , That is, use your fingers to click on the screen twice ,iOS Self contained Safari The browser will zoom to the original scale .

resolvent :

Simple and crude —— Disable page scaling , Set up  user-scalable=no. verified , This method is not compatible ios Low version phones , Such as iphone4/5 etc. .

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1,user-scalable=no">

Third party plug-ins ——FastClick, Perfect compatibility with mainstream versions ios System phone .

html Use directly in the page :

<script src="https://cdn.bootcss.com/fastclick/1.0.6/fastclick.js"></script>
<script>
window.onload=function(){
FastClick.attach(document.body)
}
</script>

vue Project use :

# install fastclick Components 
npm install fastclick --save-dev
# introduce FastClick
import FastClick from 'fastclick' // stay created or monted In the life cycle FastClick Bound to the body
FastClick.attach(document.body)

vue Project introduction FastClick Component solving IOS Under the system h5 Button click delay in page , Click on more articles about unresponsive questions

  1. Vue In the project table Component export Excel Forms and printed pages

    To experience better typesetting, please move to the original :http://blog.kwin.wang/programming/vue-table-export-excel-and-print.html The... Shown on the page table form , often ...

  2. ios Mobile access H5 On the page $(document).on Invalid binding problem

    1. Problem description use amazeUI Made a mobile website , At the head of the website is a click button drop-down menu , Click on the rest of the page to hide the drop-down menu . stay chrome Simulate Android and iOS Can trigger normally , But when it's measured on a real machine ,iOS It's not working . Simple ...

  3. vue The project introduces font to report error

    vue  The project introduces special Fonts , Always prompt for problems as a result of , stay webpack  There's something wrong with the configuration inside When introducing fonts into the project file , Should write url-loader  And can't be url

  4. vue The project introduces social sharing plug-ins

    vshare Based on Baidu share development support VUE2.X Sharing plug-ins for , Bring you more traffic ! There are many styles of buttons available , Faster code loading , Introducing social traffic , Improve the speed of web crawling .github Address :https://github. ...

  5. iOS Under the system The screen size of your phone The resolution of the And system version summary

    today   I am right. iOS Under the system The screen size of your phone The resolution of the And the system version For your reference . First It's the system :     With iOS The system is constantly upgrading , It's now iOS7.0 了 , also TA There are a lot of new changes , The most shocking ...

  6. solve Win10 Under the system C# DateTime The question of the day of the week solve ASP.NET MVC Accept Request Playload Parameter problem

    solve Win10 Under the system C# DateTime The question of the day of the week When I was writing code last night, I came across DateTime The day of the week appeared in the book , It was a mess , There is no detailed solution to Baidu online , Many people say it can be used ToStri ...

  7. iOS Next Html On the page input Get focus block when pop up keyboard input Solution —scrollIntoView()

    Problem description iOS Under the system , Move web page ,inpu Get the focus when the system virtual keyboard pops up , Occasionally there will be obstructions input The situation of , Even though the probability is small , But it has a huge impact on the user experience . Problem recurrence The original page : Page with header.main.f ...

  8. iOS Next Html On the page input Get focus block when pop up keyboard input Solution

    Problem description iOS Under the system , Move web page ,inpu Get the focus when the system virtual keyboard pops up , Occasionally there will be obstructions input The situation of , Even though the probability is small , But it has a huge impact on the user experience . Problem recurrence The original page : Page with header.main.f ...

  9. Linux Under the system MYSQL The database files in the database are migrated locally ( The way to suspend service )

    Linux Under the system MYSQL The database files in the database are migrated locally This machine adopts Ubuntu16.04 System ,tar Way to install MySQL5.7.21 The database installation folder is    /home/devil/mysql present ...

Random recommendation

  1. [R Language ]R When the language uses multithreading to access the database in large quantities, it can't connect

    Problem description : stay R Using multithreading to write to the database , Run the script on the server side (linux Environmental Science ), It's always on the second day 6-7 When there are 10000 task threads , There was a problem connecting to the database . Task interrupt , The error message is task 6xxxx failed,C ...

  2. Docker Installation and command

    CentOS install Install through script :curl -sSL https://get.docker.com/ | sh adopt yum install :yum install docker-engine============ ...

  3. CPU Data transmission with peripheral devices

    7.2 CPU The way of data transmission with peripheral devices In a microcomputer system ,CPU There are mainly program transmission modes for data transmission with peripherals . Interrupt transfer mode and direct memory access (DMA) Transmission mode , They are as follows .     7.2.1 Program transfer ...

  4. Webpack Basic environment construction

    1. Step one before installing First npm init establish package.json cnpm init; Then install it globally cnpm install webpack -g Make sure you can use it everywhere cnpm instal ...

  5. C# Pop up windows to view and upload pictures

    private void ShowSelectedPicture(string path) { FileStream fs = File.OpenRead(path); //OpenRead ; fi ...

  6. linux install tomcat, jdk What happened

    1) Unload the system jdk edition :     Check your own jdk:     #rpm -qa|grep gcj      You might see something like this :     libgcj-4.1.2-44.el5     jav ...

  7. Set up Ubuntu Next adb And fastboot jurisdiction

    Log in as a normal user linux, And then run adb devices It will prompt that the authority is not enough : List of devices attached  ????????????    no permissions   This is because ...

  8. Use Jexus 5.8.2 stay Centos We're running Asp.net core

    Installed here Jexus It's not a stand-alone version , So you need to install it first Mono   System version :Cenos7,Mono edition :5.0.1 Stable (5.0.1.1) Mono official doc:http://www.mono-p ...

  9. Java IO(IO flow )-2

    IO flow The first part (OutputStreamWriter BufferOutputStream) Converted flow Superclass is Reader and Writer It is a bridge from character flow to byte flow : You can use the specified character encoding table , Will write to stream ...

  10. easyUI Pagination plus search function

    Foreground page : js Code : ps:pagination by true When table Add... Below easyUI paging . load Function will pass the query value to datagrid And pass it to the background to reload . DAO.xml by : The background code is ...