在Ipad safari浏览器上点按一会儿，禁用默认功能

Question

Default keeping tap on the screen (eg. hold tap for 1 second) will show a option of save image / copy . However , I would like to turn off that function for my web app , is it possible? I have tried to replace the event of touchmove to selectall , however it does not work . Thanks for helping.

addEventListener('touchmove', function(e) { e.preventDefault(); }, true);

Answer 1

It could be beneficial to disable not only preventDefault, but other properties as well:

e.preventDefault(); 
e.cancelBubble = true;
e.returnValue = false;
return false;

Also the event, are you sure it's touchmove ?

Answer 2

I thought it would be worth mentioning that you can do this with pure CSS. It's probably not a really great idea, because neither IE10 or Opera Mobile support it. But it can be done, and in the future, this would probably be a better way than with JavaScript. Or if you're only talking about iPhones and iPads, this method would work really well. Here's an example on CodePen .

The code is simple:

.notouch {
    pointer-events: none;
}

Just give the class of notouch to any image that you want to effect.

If you want to do it to every image on the page, do this:

img {
    pointer-events: none;
}

And I should give an obligatory speech on useability. By doing this you're overriding default functionality that people expect to be there all the time. It makes for a really bad experience for you to turn off something like this, unless you have a really, really good reason to do so. So please, make sure you do.

Edit :

To get rid of the magnifying glass, use this code:

.notouch {
    pointer-events: none;
    -webkit-user-select:none;
}

With -webkit-user-select set to 'none' you may not even need to turn off pointer events, but I'm not sure about that. I updated the CodePen as well.