问题
I have a page that plays an mp3 file when button pressed, using javascript like:
onclick="playAudio"
There is the obvious 300ms delay. I want to use this through html5 browsers only, using the nexus 7 only. So I dont want any backup code for IE6 etc. Every solution I've seen seems quite complicated and I can't get it to work.
Is there no simple javascript solution?
回答1:
Check out the Fastclick project on github. If I understand your question, you just want to get rid of the 300ms delay on touch devices. This project is a polyfill to make touch uis much more snappy and responsive. Here is the url:
https://github.com/ftlabs/fastclick
Use Case:
Just include the fastclick library like so:
<script type='application/javascript' src='/path/to/fastclick.js'></script>
And then just instantiate it by putting following in your main app js file:
window.addEventListener('load', function() {
new FastClick(document.body);
}, false);
Hope that helps!
回答2:
As I understand your question, this problem is related to playing audio and not necessarily related to interaction with buttons. So, on the basis of that I will try to answer your question in the following.
I assume you are using the HTML5 audio API for this. Have you taken a look at the preload attribute? It has a value called auto which tells the browser that it might be a good idea to preload the audio. The drawback of this is that you risk to cause unnecessary overhead to the server since you are almost always downloading the audio no matter what. Using this approach you can, through JavaScript, subscribe to an canplaythrough event, telling you when the audio has been downloaded and is ready to be played.
More details on this subject can be found here:
- http://blogs.msdn.com/b/ie/archive/2011/05/13/unlocking-the-power-of-html5-lt-audio-gt.aspx
- https://developer.mozilla.org/en-US/docs/HTML/Element/audio
来源：https://stackoverflow.com/questions/14383349/stop-300ms-onclick-delay-on-android-web-browser