skip to Main Content

I have a page with a select option that automatically closes when clicked on some mobile devices (Chrome/Android). This problem does not occur on the desktop nor when I debug in chrome as mobile.
It’s a Shopify site, coded with the language "liquid", which basically is html.

After some days testing, I discovered thats the issue is happening because of some compatibilities problems with the Facebook Pixels code, and my page, thats refreshing and closes my select. After that I ve tryed some JS solutions to stop this event occurs like event.preventDefault(); and event.stopPropagation(), but not worked.

Here’s my code:

<div class="selector-wrapper js product-form__item">
  <label for="SingleOptionSelector-{{ section.id }}-{{ forloop.index0 }}">{{ option.name }}</label>
  <select class="single-option-selector single-option-selector-{{ section.id }} product-form__input"
    id="SingleOptionSelector-{{ forloop.index0 }}" data-name="{{ option.name }}" data-index="option{{ forloop.index }}">
    {% for value in option.values %}
    <option value="{{ value | escape }}" {% if option.selected_value==value %} selected="selected" {% endif %}>{{ value
      }}</option>
    {% endfor %}
  </select>
</div>
<script>
document.getElementById('SingleOptionSelector-0').onmouseup=function(e) {e.preventDefault();e.stopPropagation();};
</script>

I have tried everything and Googled everything I could for several days and can’t find a solution.
Any ideias?

Thanks for your help.

2

Answers


  1. if it helps anyone:

    in WordPress/woocommerce with WpRocket and PixelYourSite plugin:
    in our case was same problem and solution was excluding public.js from Delay JavaScript execution: pixelyoursite-pro/dist/scripts/public.js

    Hope it helps,

    A

    Login or Signup to reply.
  2. I ran into the same problem. I am unable to solve it but here is a test page to see the issue: (View the link in Chrome on an Android mobile device)

    "link removed"

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search