Menu
I have one button on my current web application.
The problem is that this only works on desktop. When I change it via chrome devtools to iPhone or iPad it stays as compare even when clicked and doesn't change.
I have tried: creating two separate buttons that are displayed/hidden when appropriate and using a single button and changing it's text but either way, it works on desktop but not iPhone/iPad view.
Any help is very much appreciated!
<div class="list-group">
<button type="button" class='btn goCompare' id="goCompare" data-show="compareBack" style="width: 100%;">Compare</button>
</div>
<body>
<div>
<button id="compare">Compare</button>
<button id="back" style="display: none;">Back</button>
</div>
<script type="text/javascript">
document.getElementById('compare').onclick=function(){
document.getElementById('compare').style.display = "none";
document.getElementById('back').style.display = "block";
}
document.getElementById('back').onclick=function(){
document.getElementById('compare').style.display = "none";
refreshPage();
}
function refreshPage() {
window.location.reload(true);
}
</script>
</body>
543
asked Feb 26 '26 03:02
I recommend you to have two buttons instead of one (back and compare), and hide one of them depending on your needs. You can play with the display property of the element as below:
document.getElementById("goCompare").style.display = "none";
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
