禁用长按但允许点击在HTML(移动设备)

huangapple go评论69阅读模式
英文:

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

&lt;a class=&quot;Button-one&quot; title=&quot;Relevant Title&quot; href=&quot;HTML/test.html&quot;&gt;BTN-1&lt;/a&gt;
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(&quot;my-button&quot;).addEventListener(&quot;contextmenu&quot;, function(event) {
  event.preventDefault();
});

document.getElementById(&quot;my-button&quot;).addEventListener(&quot;click&quot;, function() {
  // Your click handling code here
});

<!-- end snippet -->

huangapple
  • 本文由 发表于 2023年2月10日 03:13:57
  • 转载请务必保留本文链接:https://go.coder-hub.com/75403377.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定