So I have my website, a website without reload between site switches. For SEO reasons, my links look like this:
<a href="/site2" id="viewmore">View more</a>
<script>
// code is strongly simplified, for more clarity
document.getElementById("viewmore").addEventListener("click",function(e) {
e.preventDefault();
myHandler.goTo(e.currentTarget.href);
});
</script>
myHandler is the site handler in this case.
If I click the hotkey for opening a link in a new tab (on Mac it is CMD+Click), it does not work, as the event is prevented.
How to check if the link should open in a new tab or not? (Check if the hotkey is pressed or not)
Not sure I understood it, but try this
document.getElementById("viewmore").addEventListener("click", (e) => {
// ctrlKey / altKey / shiftKey
if (e.ctrlKey) myHandler.goTo(e.currentTarget.href);
else e.preventDefault();
});
You can store the state of the CMD key in a variable and check it when the link is clicked.
let isCmdPressed = false;
document.addEventListener("keydown",(e)=>{
if (e.key == "Meta"){
isCmdPressed = true;
}
});
document.addEventListener("keyup",(e)=>{
if (e.key == "Meta"){
isCmdPressed = false;
}
});
document.getElementById("viewmore").addEventListener("click",function(e) {
if (!isCmdPressed){
e.preventDefault();
myHandler.goTo(e.currentTarget.href);
}
});