英文:
Disable hold but allow click in html(mobile)
问题
I am making a pwa for mobile and you can hold a button with your finger then a popup will come with the standard "copy link address" "copy text" "share link" etc.
How can I disable the popup thingy without disabling the click function. The button redirects to a different site
<a class="Button-one" title="Relevant Title" href="HTML/test.html">BTN-1</a>
html code for the button.
With CSS, I can obviously use pointer-events: none;
but that will also remove the main purpose of a button.
英文:
I am making a pwa for mobile and you can hold a button with your finger then a popup will come with the standard "copy linkadress" "copy text" "share link" etc.
How can I disable the popup thingy without disabling the click function. The button redirects to a different site
<a class="Button-one" title="Relevant Title" href="HTML/test.html">BTN-1</a>
html code for the button.
With css i can obviously use pointer-events: none;
but that will also remove the main purpose of a button
答案1
得分: 0
为了在移动设备上禁用用户长按按钮时出现的上下文菜单,您可以在JavaScript中使用contextmenu
事件。contextmenu
事件在上下文菜单即将显示时触发,您可以通过在事件对象上调用preventDefault
方法来阻止它显示。
document.getElementById("my-button").addEventListener("contextmenu", function(event) {
event.preventDefault();
});
document.getElementById("my-button").addEventListener("click", function() {
// 这里是您的点击处理代码
});
英文:
To disable the context menu that appears on mobile devices when a user holds a button, you can use the contextmenu
event in JavaScript. The contextmenu
event is triggered when the context menu is about to be shown, and you can prevent it from being shown by calling the preventDefault
method on the event object.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
document.getElementById("my-button").addEventListener("contextmenu", function(event) {
event.preventDefault();
});
document.getElementById("my-button").addEventListener("click", function() {
// Your click handling code here
});
<!-- end snippet -->
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论